используя функцию вместо live в jquery 1.10

Question

Я пишу код. Мой элемент в настоящее время не существует. код

jQuery('a.feedSearchClear').on('click',function(evt){ 
    console.log('coming here'); 
    var intId = window.setInterval(function(){ 
    if(jQuery('#feedSortDropDownElement').parent().find('ul').find('a').length > 0) 
{  window.clearInterval(intId); 
     jQuery(".feedSortMenuContainer").prepend(menu_html); 
    reRenderMenu(); 

} 
},1000); 

}); 

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

Answer 1

Делегат событие родитель из динамически добавленного элемента или делегата document

jQuery(document).on('click', 'a.feedSearchClear',function(evt){ 
    console.log('coming here'); 
    var intId = window.setInterval(function(){ 
    if(jQuery('#feedSortDropDownElement').parent().find('ul').find('a').length > 0) 
    { 
     window.clearInterval(intId); 
     jQuery(".feedSortMenuContainer").prepend(menu_html); 
     reRenderMenu(); 

    } 
    ,1000);  
}); 

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

Answer 2

Что происходит, что вы подаете привязки непосредственно к выбранным элементам:

$("a.example").on("click", do_stuff); 

В выше, вы говорите, «JQuery, найти все a тегов на странице с классом example, и примените этот click связывание ". Проблема в вашем случае состоит в том, что у вас еще нет элементов на странице.

Вы можете исправить это, поместив привязку на узел предков (любой узел выше иерархии) и позволяя ему обрабатывать события для вас. Самый простой способ заключается в использовании body тега, например:

$("body").on("click", "a.example", do_stuff); 

Теперь вы говорите, «JQuery, любой раз, когда a тег с классом example щелчке body в теге, сделайте эта штука".

Вы в основном говорите тегу тела, чтобы прослушивать события от имени дочернего узла, хотя этот дочерний узел не существует в то время.