Jquery事件处理程序仅绑定到多个元素一次执行。

Question

我希望有一个事件处理程序，仅执行一次，然后从其绑定到的所有元素中解除绑定。

我知道有.one()，但使用它时，“处理程序最多在每个元素上执行一次”。

是否有一种“内置”的方法可以将事件处理程序绑定到多个元素，并在任何一个元素上执行后自动从所有元素中删除？

- epeleg

Answer 1

很简单。只需在回调函数内部解除事件处理程序的绑定即可。像这样：

$('p').on('click', function(){
  alert('I appear only one time');
  $('p').off('click'); // Removes the event. So, it will never be executed again.
})

这个脚本将删除所有类型为click的事件，这有点过于激进了。请查看off和unbind的文档以获取更多信息。

- miguel.camba

---

这样工作肯定会在某个时候导致一些问题。如果我必须手动完成，我会编写一个自己的.once（handler），它将保留指向“this”的指针和处理程序，并绑定一个替代处理程序，该处理程序将仅删除添加的处理程序。只是我希望JQuery已经有类似这样的东西了... - epeleg

在这种情况下，我不知道任何现有的 jQuery 函数可以像那样工作。 对我来说，这种方法似乎不太容易出错，但是实现一个 jQuery fn.once() 函数，它附加第二个事件并自动删除其他事件可能会很复杂。您必须注意事件的优先级，具有 stopPropagation 的事件可能无法解除绑定... 它似乎比在回调函数中添加一行更加复杂。 - miguel.camba

被接受的是“我不知道有任何现有的jquery函数像那样工作”... - epeleg

Answer 2

miguel camba已经告诉您要查看wiki以了解unbind。正确的解决方案如下：

    var handler = function() {
        alert('I appear only one time');
         $('p').unbind('click', handler);
    }
    $('p').bind('click', handler);

这将仅从点击事件中解绑定此处理程序。

//编辑：

另一种解决方案是为您的单击事件命名空间：

$('p').bind('click.myClickEvent', function() {
    alert('I appear only one time');
    $('p').unbind('click.myClickEvent');
});

- Jochen Ullrich

---

我喜欢使用闭包的第一种方法。至于第二种解决方案，对我来说仍然不够“可重入”，因为如果我将其放在一个以警报作为参数的函数中，那么多次调用该函数只会触发一个警报，而不是每次调用函数都触发一个警报。 - epeleg

第一个解决方案可以使用 .on() 和 .off() 来实现吗？ - epeleg

我猜差不多就是一样的。 - Jochen Ullrich