Jquery 使用on（）将事件处理程序附加到将动态创建的元素

我在（）上遇到问题，因为live（）已被弃用

这似乎不起作用：

$('body').on("click", ".myButton", console.log("clicked"));

当我刷新页面时，控制台会立即显示“clicked”，即使我没有单击任何东西，但当我实际单击它时不会触发

---

此外，将此应用于按钮所在的DIV似乎比应用于主体的巨大范围更有效。这是真的吗？

您看到的奇怪行为是因为您实际上正在调用

console.log

您自己。你应该把它包装成一个函数

function () { console.log('clicked'); }

---

你问题的第一部分已经得到其他答案的充分回答。您正在调用

console.log（）

函数，而不是传递对以后可以调用的函数的引用

回答问题的第二部分，其他人尚未回答：

是的，将事件处理程序的作用域设置为按钮的更接近的祖先，而不是使用

$（'body'）

，这样会执行得更好

您应该选择一个按钮的祖先，该祖先尽可能靠近按钮，但在安装事件处理程序时静态存在（以后不会动态销毁/创建）

.live（）

被弃用，取而代之的是

.on（）

的一个主要原因是

.live（）

将其所有事件处理程序放在

文档

对象上，在繁忙的页面中，

文档

对象上可能有许多委托事件处理程序。当这种情况发生时，任何单个事件都会一直冒泡到

文档

对象，然后必须将每个事件与一长串可能的委托事件处理程序进行比较。因为这通常意味着运行选择器操作而不是

eventTarget

，所以这可能会变得很慢

另一方面，如果您选择了一个更接近所需eventTarget的祖先对象，那么一个更小的对象列表中的更小的事件列表将流经这个特定的委托事件处理程序，整个事件系统可以执行得更好

---

为了在处理大量事件/对象时获得最佳性能，委托事件处理程序应尽可能靠近目标对象应用。

从jQuery 1.7开始，.delegate（）已被.on（）方法取代。啊，我现在对（）的理解好多了。比你强，尼克！它无法工作，因为您正在立即执行

console.log（“单击”）

。使用

.live（）

也会遇到同样的问题。传递一个函数引用，您就会没事了。是的，您应该始终将事件处理程序绑定到尽可能接近实际元素的位置。可以说，这不是范围的问题，而是后代链的长度。可能是@FelixKling的复制品，问题是它何时开火，我的问题是在哪里以及为什么。console.log（）需要在一个函数中，而不仅仅是它本身。我的问题是关于位置和原因：如果我错了，请纠正我，但问题是“为什么单击事件处理程序会在页面加载时立即启动？”并且公认的答案完美地描述了您应该做什么，这也是其他答案的建议，只是信息少了。无论如何，每个问题你只能问一个问题。我很抱歉。如果没有目的，版主可以删除这个问题。非常感谢！只需将其包装在函数中，这样它就不会立即调用。

$(function(){
    $('body').on("click", ".myButton",function(){
       alert("clicked");
    });
});

$('body').on("click", ".myButton", function() {
     console.log("clicked")
});