防止 on('click') 被调用两次

Question

function foo() {
  bar.on('click', function (evt) {
    console.log("click");
  }
}

如果多次调用 foo，则会多次添加单击处理程序，从而导致错误的行为。

你如何阻止这种情况？

Answer 1

您可以使用

.one()只调用一次：

将处理程序附加到元素的事件。处理程序被执行 每个事件类型的每个元素最多一次。

function foo() {
  bar.one('click', function (evt) {
    console.log("click");
  }
}

JQuery - .one((

Answer 2

您可以像下面这样执行此操作。

function foo() {
  bar.off('click');
  bar.on('click', function (evt) {
    console.log("click");
  }
}

Answer 3

如果只希望处理器仅单击一次即可存在，请使用 $.fn.one ：

bar.one( "click", handler );

从文档中：

.one(( 方法与 .on(( 相同，只是处理程序在第一次调用后被取消绑定。

话虽如此，我鼓励您考虑是否应该在多次调用的方法中绑定处理程序。这实际上可能是您需要解决的更大问题。