当链接使用jquery制作动画时，请防止按钮在完成之前再次被单击

因此，我在页面侧面有一个按钮，允许用户转到下一张幻灯片（第页）

因为页面大小可以是不同的宽度，所以这是在开始时计算的

所以链接所做的就是运行一个动画。如果我双击按钮，尽管它已设置为远动画

这是我的密码

jQuery(".nextSlide").click(function() {

slide("forward", pageSize);
    //for now assume pageSize is 950

});

---

---

---

因此，如果用户单击按钮

<a href="#" class="nextSlide">next</a>

这两次可能会弄乱动画

有没有办法确保

a） 按下按钮后，在动画完成之前，不能再次按下该按钮

或

b） 幻灯片切换到下一张幻灯片，然后再次运行分析

---

谢谢

将您的点击事件绑定到一个函数，这样您就可以自己控制点击操作了。该职能应如下：

function clickHandler(event) {

    // If event isn't already marked as handled, handle it
    if(event.handled !== true) {

        // Kill event handler, preventing any more clicks
        $(".nextslide").die("click");

        // Do your stuff here
        slide("forward", pageSize);

        // Mark event as handled
        event.handled = true;
    }
    // Else
    return false;
}

// Bind click to handler for the first time
$('.nextslide').live("click", clickHandler);

如果元素上的事件已被单击，则这将终止该事件

然后在动画结束时，重新绑定事件：

// Rebind refresh click handler
$('.nextSlide').live("click", clickHandler);

工作示例

jQuery(document).ready(function () {
 jQuery(".touchslider-prev").on("click", clickHandlerPrev);
});

---

---

---

---

.live（）

折旧。使用（）上的

。

。是的，对不起，我从旧代码中删除了它，并重新调整了它的用途。实际上，这不起作用。。使用jQuery上面的代码（“.touchlider prev”）。在（“click”，clickHandlerPrev）上；函数clickHandlerNext（事件）{console.log（event.handled）；}返回未定义。。为什么？它不起作用还是你认为应该返回false？在你设置之前，Handled可能不会被设置为任何东西。我曾经使用过。off，现在似乎可以工作了。模具已在最新版本中移除。幻灯片功能完成后，您需要重新绑定事件。

function clickHandler(event) {

    // If event isn't already marked as handled, handle it
    if(event.handled !== true) {

        // Kill event handler, preventing any more clicks
        $(".nextslide").die("click");

        // Do your stuff here
        slide("forward", pageSize);

        // Mark event as handled
        event.handled = true;
    }
    // Else
    return false;
}

// Bind click to handler for the first time
$('.nextslide').live("click", clickHandler);

// Rebind refresh click handler
$('.nextSlide').live("click", clickHandler);

jQuery(document).ready(function () {
 jQuery(".touchslider-prev").on("click", clickHandlerPrev);
});

function clickHandlerPrev(event) {

// If event isn't already marked as handled, handle it
if(event.handled !== true) {

    // Kill event handler, preventing any more clicks
    jQuery(".touchslider-prev").off("click");

    // Do your stuff here

    slide("back");

    // Mark event as handled
    event.handled = true;
} 


return false;
}

function slide(data) {

var newLeft = calcLeft(data, 950);

  jQuery('#pageHolder').animate({
    left: newLeft
  }, 400, function() {
    calcNav(950);
    calcPage(950);
    jQuery(".touchslider-prev").on("click", clickHandlerPrev);


  });

}