Javascript 禁用单击直到动画完成

我希望动画在允许单击“下一步”按钮之前运行，以便动画不会失去同步。我不知道什么是绑定/取消绑定或类似于whilenottrue循环的更好的方法

function first_horizontal_slider() {
    var $scroller = $('div#first_slider');
    var counter = 0;

    $('div#first_left_btn a').css({ 'background': 'url(img/left_arrow_bw.png) no-repeat' });
    $('div#first_right_btn a').css({ 'background': 'url(img/right_arrow.png) no-repeat' });
    $('div#first_left_btn a').click(function () {

        if (counter != 0) {
            $('div#first_right_btn a').css({ 'background': 'url(img/right_arrow.png) no-repeat' });

            $scroller.stop().animate({
                "left": "+=732px"
            }, "slow");
            counter--;

            if (counter == 0) {
                $('div#first_left_btn a').css({ 'background': 'url(img/left_arrow_bw.png) no-repeat' });
            }
        }
        return false;
    });

    $('div#first_right_btn a').click(function () {
        if (counter != 2) {
            $('div#first_left_btn a').css({ 'background': 'url(img/left_arrow.png) no-repeat' });
            $scroller.stop().animate({
                "left": "-=732px"
            }, "slow");
            counter++;

            if (counter == 2) {
                $('div#first_right_btn a').css({ 'background': 'url(img/right_arrow_bw.png) no-repeat' });
            }
        }
        return false;
    });
}

---

如果使用按钮或输入类型=按钮，则可以在动画之前将.disabled设置为true，然后返回false。

在animate的回调函数中，您可以将按钮设置为enabled。

您可以在动画开始时禁用按钮，并在动画的完整方法中进行回调以启用按钮

 //before animation starts
disableButton()

$scroller.stop().animate({
            "left":"+=732px"
        },"slow", 'swing', enableButton); //added default easing

function enableButton() {
   $('#thebutton').removeAttr('disabled');
}

function disableButton() {
   $('#thebutton').attr('disabled', 'disabled');
}

使用或检查通过