在某些情况下，.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时，您的ID为$('#button2').on的元素不存在，则您不会绑定任何内容。这与live非常不同。您必须在非空集合上调用on。

Sample

Answer 2

您的示例“非工作”jsfiddle脚本有一个阻止其工作的错误：('di'v).on(中的一个简单的javascript错误阻止所有脚本运行。

试试your fiddle, updated，看看.on()语法是否正常运行。在您提供的简单案例中，无需使用.live()，也无需使用新方法.on('event', 'selector', fn)。