首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >事件处理委托或直接

事件处理委托或直接
EN

Stack Overflow用户
提问于 2013-08-09 16:50:29
回答 3查看 66关注 0票数 3

什么时候使用委托比直接将处理程序附加到相关元素更好(性能/可读性/最优)?

代码语言:javascript
复制
$(".container").on("click", "button", function(){});
$(".container button").on("click", function(){});
EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2013-08-09 16:54:31

这取决于容器中绑定的单击事件的数量。

代码语言:javascript
复制
$(".container button").on("click", function(){});

如果只有少数几个事件发生,并且button已经出现在页面上,那么受上述签名约束的事件应该会为您完成工作。

代码语言:javascript
复制
$(".container").on("click", "button", function(){});

当一个元素被动态地添加到您的页面时,那么使用Event Delegation,其中事件的正常绑定将无法工作。

性能问题取决于应用程序的重事件驱动程度。如果这个数字很小,那么性能就不重要了。但是,假设在容器中的元素上有1000个单击事件。

是否为具有相同功能的所有公共元素创建一个单击。在这种情况下,您可以使用委托,其中事件将附加到单个元素,这会导致代码的可维护性降低和可读性增加。

票数 1
EN

Stack Overflow用户

发布于 2013-08-09 16:53:32

如果您想要添加更多的元素,并且让侦听器仍然工作而不再次添加它们,委托就会派上用场。也许您已经动态地创建了需要具有相同事件侦听器的元素。我不知道表演的答案。我很好奇别人怎么想!

在您的示例中,如果向.container添加了一个新按钮,则委托模型将允许侦听器工作。

票数 3
EN

Stack Overflow用户

发布于 2013-08-09 16:54:09

当目标元素是动态的时,事件委托是最好的,这意味着它们在DOM就绪时不存在,或者它们的属性以改变处理程序应该处理事件的方式改变。

当您有很多元素要绑定时,它也是很好的。如果您有一个包含1000个td元素的表,则可以执行一个事件绑定到table,而不是1000个绑定到每个` to。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/18151781

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档