jquery - .on() 方法在某些情况下不会触发

Question

在某些情况下，.on() 事件方法不会触发，但 .live() 会触发。
然而，从 jQuery 1.7 开始，.live() 方法已被弃用。
因此最好使用 .on() 方法来附加事件处理程序。

所以这就是问题 - http://jsfiddle.net/rGRdT/2/
可以看到，单击按钮时会调用一次 .one() 方法，但是单击刚刚创建的第二个按钮时，不会调用 .on() 方法。

$('#button2').on('click', function() {
    $('div').append('<input type="button" value="add2" id="button3" />'); 
});

您可以在这里看到 - http://jsfiddle.net/GFCt9/
当您单击第二个按钮时，.live() 方法将被完美调用。

$('#button2').live('click', function() {
    $('div').append('<input type="button" value="add2" id="button3" />');
});​

那么如何使用 .on() 方法，使其像上面示例中的 .live() 方法一样工作？

Answer 1

$('#button2').live('click', function() {

不等于

$('#button2').on('click', function() {

但是

$(document).on('click', '#button2', function() { // you may replace document with something more precise but existing

如果调用 $('#button2').on 时 id 为 button2 的元素不存在，则您没有绑定(bind)任何内容。这与live有很大不同。您必须对非空集合调用 on。

Sample