Jquery добавляет слушатели событий к динамически добавленным элементам

367
44

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

спросил(а) 2021-01-19T16:48:40+03:00 9 месяцев назад
1
Решение
501

Используя .on(), вы можете определить свою функцию один раз, и она будет выполняться для любых динамически добавленных элементов.


например

$('#staticDiv').on('click', 'yourSelector', function() {
//do something
});

ответил(а) 2021-01-19T16:48:40+03:00 9 месяцев назад
276

$(document).on('click', 'selector', handler);

Где click - имя события, а handler - обработчик событий, например ссылка на функцию или анонимную функцию function() {}

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

ответил(а) 2021-01-19T16:48:40+03:00 9 месяцев назад
65

Вы динамически генерируете эти элементы, поэтому любой слушатель, применяемый при загрузке страницы, не будет доступен. Я отредактировал вашу скрипку с правильным решением. В основном 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/

ответил(а) 2021-01-19T16:48:40+03:00 9 месяцев назад
66

При добавлении нового элемента с вызовами плагина jquery вы можете сделать следующее:


$('<div>...</div>').hoverCard(function(){...}).appendTo(...)

ответил(а) 2021-01-19T16:48:40+03:00 9 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема