Как связать функцию в динамическом html, возвращаемом при вызове ajax

Question

Недавно я разрабатывал функцию, и мне нужно добавить функцию к динамически сгенерированному HTML через ajax. Код выглядит следующим образом:

$.ajax(
    'success': function(data){ 
     //do sth 
     a.html(res); 
     $(document).on('hover',sth in res,function(){ 
      console.log(1) 
      $(this).toggleClass('classA').toggleClass('classB'); 
     }) 
    } 
) 

Это, кажется, не работает, так как console.log() ничего не печатает. Есть ли проблемы в процессе привязки? Я изменил hover на клик, mousein и т. Д., И никто из них, похоже, не работает. Другие функции в вызове ajax работают нормально.

Answer 1

Когда HTML добавляется динамически, Event Delegation удобно, в вашем случае вы можете прикрепить слушателя событий что-то как-

$(document).on("click", "sth in res", function(event) { //Give proper selector in place of sth in res 
    console.log(1) 
    $(this).toggleClass('classA').toggleClass('classB'); 
}); 

Кроме того, вы можете захотеть поместить код слушателя из Аякса success делегата, а in $(document).ready(function() {}); способ.

Обратите внимание, что имя класса sth in res будет относиться к трем различным именам tag, а не к одному классу. Если и хочет, чтобы выбрать элемент, который имеет все три класса, в то же время, то селектор будет .sth.in.res -

$(document).on("click", ".sth.in.res", function(event) { //Give proper selector in place of sth in res 
    console.log(1) 
    $(this).toggleClass('classA').toggleClass('classB'); 
}); 

Answer 2

делегация Event позаботится об этом за вас. Не делегировал подход, который не работает для вас (это то, что вы не хотите):

$(selector).on('click', function(){ ... }); 

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

$(document).on('click','selector',function(){ ... }); 

Вот некоторые ссылки, чтобы помочь, чтобы вы начали с узнаванием больше:

https://learn.jquery.com/events/event-delegation/

jquery Event Delegation