0

Запросом Ajax на странице подгружается элемент input.
Как сделать автоматический клик по этому элементу после загрузки на страницу?

3 ответа 3

1

Вам этот клик нужен, чтобы фокус перевести на этот элемент и сразу можно было начать печатать в него?

Если так, есть jQuery.focus().

Рабочий пример.

2
  • 2
    За один только коммент к коду плюсик поставлю.=) Надо это как общепринятую практику ввести. Ну и за телепатию, так как, похоже, имелось в виду именно это. )
    – knes
    Commented 24 окт. 2014 в 15:12
  • @knes, я стараюсь всегда ставить ссылку на исходный вопрос : )
    – Sergiks
    Commented 24 окт. 2014 в 15:17
0

Как вариант:

$( document ).ajaxComplete(function() {
  $('#new_inserted_element').trigger('click');
});

http://jsfiddle.net/2n9bLm8u/

N.B. alert с текстом ERROR выскакивает, потому что нельзя просто так взять и запросить гугл по аяксу. Если урл взять нормальный, должен вываливаться ОК: см. внимательно код.

7
  • Не совсем ясно о ajaxComplete(function() {}? Это callback в Succes от AJAX?
    – Jony
    Commented 24 окт. 2014 в 13:59
  • Это любое завершение. Но если элемента #new_inserted_element нет, то событие просто не сработает: об этом заботится jQuery.
    – knes
    Commented 24 окт. 2014 в 14:18
  • Ну так элемент #new_inserted_element как раз такие в ответе от Ajax и создается в posting.done(function( response ) { // here }). _____ Т.е. Ваш пример нерабочий.
    – Jony
    Commented 24 окт. 2014 в 14:23
  • @Oleg Ponomarchu, а в чем проблема после создания элемента кликнуть по нему через trigger('click')?
    – andreyqin
    Commented 24 окт. 2014 в 14:35
  • 1
    ээ... >Т.е. Ваш пример нерабочий А вот сейчас обидно было! jsfiddle.net/2n9bLm8u
    – knes
    Commented 24 окт. 2014 в 14:45
0

Плохая идея использовать голый слушатель вида:

$( document ).ajaxComplete(function() {
  $('#new_inserted_element').trigger('click');
});

Это может привести к нежелательным кликам тогда когда не нужно, если вдруг на странице есть еще какие либо другие аяксы. + лучше все события выполнять именно там где они необходимы, что бы потом не думать, что за магия вообще творится )

Посмотрите пример CodePen

// тут добавляем ваш инпут и ставим на него фокус
let addInput = function (msg) {
  $("body").append("<input id='new-input' type='text' value='' name='name'>");
  /**
  у append нет callback метода
  а значит после добавления элемента в ДОМ, выполните фокусировку через некоторое время, например 100мс
  Этого будет достаточно что бы append отработал и в DOM появился ваш input
  */
  setTimeout(function () {
    $("#new-input").focus();
  }, 100);
};

// использую для теста CDN jQuery c cloudflare, потому что они разрешают кросдоменные запросы
let your_url =
  "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js";
$.ajax({
  type: "GET",
  url: your_url,
  //dataType: 'json', //раскомитить, если нужно
  data: {},
  success: function (msg) {
    try {
      addInput(msg);
    } catch (err) {
      console.log("Ошибонька success" + err);
    }
  },
  error: function (jqXhr, textStatus, errorMessage) {
    console.log(textStatus + "dd");
  },
  failure: function (jqXhr, textStatus, errorMessage) {
    console.log("Ошибонька" + errorMessage);
  }
});

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.