由于rails资产而多次触发jQuery事件？

Question

我看过后jQuery click events firing multiple times和why is jQuery click event firing multiple times，但我仍然不明白为什么会发生这种情况。

我正在开发一个rails-4.2.9应用程序，并有一个自定义的.js，如下所示：

$(function() {
    var $addNotificationButton = $('#add-notification-button')
    $addNotificationButton.on('click', function()
    {
      console.log("hi from js")
      //Code for launching a dialog       
    })
});  

现在，当第一次加载页面并单击按钮时，我只看到一条打印语句，并看到对话框在新的route中启动。当我关闭对话框并重新单击按钮时，我可以在控制台上看到2个打印语句，下一个时间是3，依此类推。

我的.js放在Application.js中，在控制台上，我看到一条来自Application.js的打印语句，但其他被添加的语句分别来自Chrome中的VM-2058.js和Firefox中的foundation.js。我不知道这些是从哪里冒出来的，也不知道是怎么冒出来的。

我的问题是：

1)为什么会发生这种情况？我认为print语句只会在单击按钮时执行。这不是jquery事件处理程序的工作方式吗？

2)虽然我可以使用one而不是on来防止它，但我的一个同事提到我们不应该使用one，因为它会在第一次单击后解除事件与按钮的绑定，而只考虑加载controller所需的.js。现在，这也是可行的，但这是我们应该做的吗？我意识到这是一个与rails assets更相关的问题。

我的application.js看起来像这样：

//= require_tree .
//= require ./notification (refers to the .js file above)

Answer 1

问题是你设置了多个绑定处理程序。我不确定你代码的其余部分，但肯定有什么东西在调用/重新加载JS文件，并多次执行那个匿名函数，每次都向event添加一个“绑定”。这就是为什么它会随着点击次数的增加而增加?也许你的对话框再次加载了JS ?不确定。

如果您这样做了：

$(function() {
    var $addNotificationButton = $('#add-notification-button')
    $addNotificationButton.off('click').on('click', function()
    {
      console.log("hi from js")
      //Code for launching a dialog       
    })
});  

它应该像你所期望的那样工作，它将解绑任何现有的'click‘事件(所以如果你绑定了其他东西，它将需要重新绑定)。