相同脚本在点击事件javascript / jquery

Question

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

});

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

第二次，我单击此按钮，警报显示了一次（按预期）。

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

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

可能是什么问题？如何防止同一脚本反复加载？

谢谢！

Answer 1

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

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

Answer 2

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

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

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

Answer 3

@Bravo已经建议您需要关闭处理程序。您每次单击时都添加一个click事件处理程序。因此，您应在添加其他点击处理程序之前将其删除。像这样：

VBox