javascript - 如何在我的函数运行时取消绑定(bind)或防止其他点击事件发生？

Question

我设置了一个旋转木马，并将点击事件绑定(bind)到导航箭头。单击它们时，我使用 jQuery animate 为下一个旋转木马幻灯片的元素设置动画，并且由于动画的性质，我使用了几次 setTimeout()。

我有一个错误，如果我单击一个箭头，然后快速单击上一个或下一个箭头，动画将由于超时(这在该项目中是必需的)而变得困惑并且不会在屏幕上渲染任何内容。我已经研究了一段时间，我认为最好的方法可能是在当前动画完成之前阻止其他箭头被点击。

每个箭头都由 click 控制，而不是 on:('click', function() ... etc:

$("#arrow1").click(function() {...}

我看过

$("element").off("click");

但由于它们不是使用“on”方法附加的，所以我认为这行不通。

我想要这样的东西:

$("#arrow1").click(function() {
 $("#arrow2, #arrow3, #arrow4").off("click");
 // do my animations, then
 $("#arrow2, #arrow3, #arrow4").on("click");
}

但我还没能让它发挥作用。

Answer 1

.off 和 .on 未按预期工作。 .click 方法和其他事件方法在后台使用 .on 方法来绑定(bind)处理程序。当 .off 方法在没有任何特定处理程序的情况下被调用时，它会删除(而不是临时禁用)特定事件的所有绑定(bind)处理程序。在不传递处理程序的情况下调用 .on 没有任何效果。

在您的情况下，您可以使用标志而不是操纵事件处理程序，这也比(重新)绑定(bind)和删除事件处理程序更有效。