javascript - 如何避免一个 'click' 触发两个函数？

Question

嗨，我有两个 JS 函数:

1. $('button').click(function() 内 $(document).ready

2. $(document).on('click','button', function()

第二个功能是为我动态生成的按钮设计的。我遇到的问题是，当我单击与第一个功能关联的按钮时，第二个功能也会被触发。我怎样才能避免这种情况？

PS:因为我给每个按钮都命名了，这种冲突根本不影响功能，但我认为一键触发两个功能不是很聪明:(

Answer 1

这是因为事件传播。

您可以在第一个处理程序中停止事件传播，以防止触发动态处理程序。

$('button').click(function (e) {
    e.stopPropagation();
    //your code
})

但更合适的解决方案是向所有动态按钮元素添加一个公共(public)类，并使用委托(delegate)处理程序仅将它们作为目标

<button class="mydynamic"></button>

然后

$(document).on('click','button.mydynamic', function(){
});