单击事件javascript / jquery多次加载相同的脚本答案

【问题标题】：same script loading multiple times on click event javascript/jquery单击事件javascript / jquery多次加载相同的脚本
【发布时间】：2018-11-15 10:22:17
【问题描述】：

$(document).click(function() {
  $('.settings').click(function(){
    alert();
  });

});

我在click 事件上加载此脚本，因为我无法在ready 事件上加载此脚本。现在，当我第一次单击类 settings 的按钮时，没有任何事情发生，因为在我单击按钮后加载了脚本。

第二次，我点击了这个按钮，警报显示了一次（如预期的那样）。

但意外的行为是，当我第三次点击时，警报显示了 2 次。当我第 4 次单击时，会显示 3 次警报，依此类推。

我能想到的一个可能原因是，每次点击时都会加载脚本。

可能是什么问题？如何防止同一段脚本一次又一次地加载？

谢谢！

【问题讨论】：

每次单击时，都会向$('.settings') 添加另一个单击处理程序 - 也许您需要off jquery 函数
如何防止这种行为？我怎样才能只添加一次？
也许你需要off jquery 函数

标签： javascript jquery ruby-on-rails

【解决方案1】：

每次单击时，都会为.settings 添加一个新的处理程序。试试这个：

$(document).on('click', '.settings', function() {
  alert();
});

【讨论】：

注意：这将改变这种行为...... 第一次，什么都没有发生如预期的那样

【解决方案2】：

如果在设置按钮中第一次单击时仅触发一次与文档相关的 Click 事件，则此问题将得到解决。

如果您希望事件处理程序只触发一次，请查看 .one()：http://api.jquery.com/one

 $(document).one("click",function() {
      $('.settings').click(function(){
        alert();
      });
    });

【讨论】：

【解决方案3】：

正如@Bravo 已经建议您需要关闭处理程序。每次单击时都添加一个单击事件处理程序。因此，您应该在添加另一个单击处理程序之前删除以前的单击处理程序。比如：

$(document).off('click').on('click', (function() {
  $('.settings').off('click').on('click', function(){
    alert();
  });
});

【讨论】：