觸發動態元素上的自定義事件

Question

我創建了自定義login.validate事件並將其綁定到.question動態元素。 我無法使用觸發方法（）觸發新事件。這裏是JS小提琴和腳本http://jsfiddle.net/PzSYM/400/

<h2></h2> 
<button>generate new element</button> 
<p class="generateEvent">Trigger event validate</p> 


$("button").click(function() { 
    $("h2").html("<p class='test'>click me</p>") 
}); 


$('p.test').bind('validate', function(){ 

    alert('This is working'); 
}) 

$('h2').on('login.validate', 'p.test', function(){ 
    console.log('Good now the validate event need to be trigered'); 
}); 

$('.generateEvent').click(function(){ 
    $('p.test').trigger('login.validate'); 

}); 

如何觸發動態元素的自定義事件？

Answer 1

您需要使用事件代表。這裏是工作示例：

http://jsfiddle.net/tkirda/PzSYM/414/

$("button").click(function() { 
    $("h2").html("<p class='test'>click me</p>") 
}); 


$(document).on('validate', 'p.test', function() { 
    alert('This is working'); 
}) 

$('h2').on('login.validate', 'p.test', function() { 
    console.log('Good now the validate event need to be trigered'); 
}); 

$('.generateEvent').on('click', function() { 
    $('p.test').trigger('validate'); 
});