使用上（）将事件处理程序附加到将动态创建

我在使用上（麻烦）的元素，因为现场（）已过时。使用上（）将事件处理程序附加到将动态创建

这似乎并不工作：

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

当我刷新页面，控制台会立即说：“点击”即使我没有任何点击，但是当我真正点击不火它。

而且，它似乎更高性能的将其应用到DIV按钮在，而不是身体的巨大范围。这是真的？

来源

2012-04-15 SpaceNinja

，因为你正在执行'的console.log它不工作（“点击”）'马上。 ''.live（）'会导致同样的问题。通过函数引用，你会没事的。是的，你应该总是将事件处理程序尽可能地接近实际元素。这不是关于范围，而是关于后代链的长度，可以这么说。 – 2012-04-15 17:47:25

[为什么点击事件处理程序会在页面加载时立即触发？]（http://stackoverflow.com/questions/7102413/why-does-click-event-handler-fire-immediately-upon-page-load） – 2012-04-15 17:50:03

@FelixKling，这个问题是关于什么时候开火，我的是关于什么地方以及为什么。 console.log（）需要位于一个函数中，而不仅仅是它本身。 – SpaceNinja 2012-04-15 17:56:56

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

来源

2012-04-15 17:45:32 thecodeparadox

非常感谢！只需将它包装在一个函数中，以便它不会立即调用。 – SpaceNinja 2012-04-15 18:00:31

你看到的奇怪的行为是因为你实际上是在该行调用console.log自己。你应该把它包装在一个函数中。

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

来源

2012-04-15 17:44:34 nickf

从jQuery 1.7开始，.delegate（）已被.on（）方法取代。 – 2012-04-15 17:46:41

那怎么样... – nickf 2012-04-15 17:46:56

啊，我现在对（）的理解好多了。比你，NickF！ – SpaceNinja 2012-04-15 17:59:16

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

来源

2012-04-15 17:45:08 Shyju

你的问题的第一部分已经通过其他的答案得到充分的回答。您正在调用您的console.log()函数，而不是将参考传递给稍后可以调用的函数。

要回答你的问题的第二部分，它没有其他人还没有解决：

是的，它会以按钮的接近祖先进行更好的范围事件处理程序，而不是使用$('body')。

你应该选择你的按钮的祖先，那就是尽量靠近按钮的可能，但目前静态当时您安装的事件处理程序（而不是动态销毁/后创建）。

是.live()是赞成不赞成.on()一个主要的原因是，.live()把所有它的事件处理程序document对象上，并在繁忙的页面，也可以委托事件处理程序的document对象很多。当发生这种情况时，单个事件一直到达document对象，然后必须将每个事件与可能的委托事件处理程序的长列表进行比较。由于这通常意味着运行选择器操作而不是eventTarget，所以这确实会变慢。

另一方面，如果您选择了一个更接近所需eventTarget的祖先对象，那么通过此特定委派事件处理程序和整个事件的更小的对象列表中的更小的事件列表系统可以表现更好。

对于很多事件/对象，委托的事件处理程序最佳性能应该尽可能靠近目标对象尽可能地被应用。

来源

2012-04-15 17:55:00 jfriend00

使用上（）将事件处理程序附加到将动态创建

回答

相关问题