Библиотека jQuery добавление прослушивателей событий для динамически добавленных элементов [дубликат]

Question

Библиотека jQuery добавление прослушивателей событий для динамически добавленных элементов [дубликат]

этот вопрос уже есть ответ здесь:

обработчик событий не работает с динамическим содержимым [дубликат]

2 ответы

Итак, прямо сейчас я понимаю, что для того, чтобы прикрепить прослушиватель событий к динамически добавляемому элементу, вам нужно переопределить прослушиватель после добавления элемента. Есть ли способ обойти это, так вам не нужно выполнять целый дополнительный блок кода?

434 4

jQuery events

4 ответов:

Comments

Ничего не найдено.

Jack · Accepted Answer · 2015-10-08 14:53:11

используя .on() вы можете определить свою функцию один раз, и она будет выполняться для любых динамически добавляемых элементов.
$('#staticDiv').on('click', 'yourSelector', function() {
  //do something
});

zerkms · Accepted Answer · 2012-08-22 04:47:54

$(document).on('click', 'selector', handler);
здесь click - это имя события, а handler - это обработчик событий, например ссылка на функцию или анонимную функцию function() {}

PS: Если вы знаете конкретный узел, в который вы добавляете динамические элементы - вы можете указать его вместо document.

Swoogie McDoogie · Accepted Answer · 2014-10-01 21:24:21

вы динамически генерируете эти элементы, поэтому любой прослушиватель, примененный при загрузке страницы, не будет доступен. Я отредактировал вашу скрипку с правильным решением. В основном jQuery удерживает событие для последующей привязки, прикрепляя его к родительскому элементу и распространяя его вниз к правильному динамически созданному элементу.
$('#musics').on('change', '#want',function(e) {
    $(this).closest('.from-group').val(($('#want').is(':checked')) ? "yes" : "no");
    var ans=$(this).val();
    console.log(($('#want').is(':checked')));
});
http://jsfiddle.net/swoogie/1rkhn7ek/39/

haotang · Accepted Answer · 2013-09-18 19:04:16

при добавлении нового элемента с вызовами плагина jquery, вы можете сделать следующее:
$('<div>...</div>').hoverCard(function(){...}).appendTo(...)