Как я могу вызвать функцию после того, как элемент был создан в jquery?

Question

Я хочу вызвать функцию после создания элемента.Есть ли способ сделать это?

Пример:

$("#myElement").ready(function() {
    // call the function after the element has been loaded here
    console.log("I have been loaded!");
});

Answer 1

Как вы создаете этот элемент?

Если вы создаете его в статическом HTML, то просто используйте .ready(handler) или .on("load", handler).Однако, если вы используете AJAX, это еще одна проблема.

Если вы используете jQuery, то load() функция, затем есть обратный вызов, который вы можете запустить, когда содержимое будет загружено:

$('#element').load('sompage.html', function(){ /* callback */ });

Если вы используете jQuery, то $.ajax или $.get/$.post функции , то в этом случае происходит успешный обратный вызов:

$.ajax({
  url: 'somepage.html',
  success: function(){
    //callback
  }
});

Если вы просто создаете элемент и добавляете его следующим образом:

$('body').append('<div></div>');

Тогда вы можете сделать это вместо этого:

$('<div />', { id: 'mydiv' }).appendTo('body').ready(function(){ /* callback */ });

Но это не будет иметь значения - потому что это синхронно (что означает, что следующая строка кода все равно не будет запущена до тех пор, пока не будет добавлен элемент в DOM...- если только вы не загружаете изображения и тому подобное), так что вы можете просто сделать:

$('<div />', { id: 'mydiv' }).appendTo('body');
$('#mydiv').css({backgroundColor:'red'});

Но на самом деле, говоря, ЧТО вы могли бы просто сделать это:

$('<div />', {id:'mydiv'}).appendTo('body').css({backgroundColor:'red'});

Answer 2

Возможно, вы захотите заглянуть в jQuery ЖИВЫЕ КОНЦЕРТЫ Мероприятия.Вы прикрепляете обработчик событий к селектору, который либо соответствует сейчас, либо после создания дополнительных элементов в вашем DOM.

Так что, если у вас есть <ul> и вы динамически создаете новые <li> предметы, находящиеся в вашем $(document).ready() вы можете подключить селектор к обработчику событий, чтобы все ваши <li> элементы будут подключены к этому событию.

Вот такой jsFiddle попробуйте эти демо-версии live.

Надеюсь, это поможет.

Answer 3

вы можете попробовать этот код

родовое слово родовое слово родовое слово

Answer 4

Иногда это необходимо для элемента DOM, созданного / загруженного вне вашего собственного скрипта, либо другой библиотекой js, либо событием вне вашего прямого контроля.

Для таких сценариев я всегда устанавливаю интервал, который периодически проверяет, существует ли целевой элемент, и если это правда, интервал удаляется сам и запускает функцию обратного вызова.

Для этого у меня есть предопределенная функция, которую я использую повторно:

родовое слово

Answer 5

проверить .live () лучше всего после создания элемента,

родовое слово

А потом добавить новый элемент:

родовое слово

Answer 6

родовое слово

Answer 7

Вы можете использовать setInterval . функция для проверки существования элемента:

родовое слово

Answer 8

Самый простой - напрямую вызвать обратный вызов после создания элемента :)