两个jQuery事件不同步

时间:2017-09-22 11:10:58

标签: jquery

我正在使用jQuery来应用 slideDown slideUp 事件。

我有一个复选框和两个 div myDiv1myDiv2)。该复选框激活两个div以向下滑动或向上滑动。所以两者都必须向上或向下(不是一个向下,另一个向上)。

但如果我在一个div完成向下滑动之前快速点击复选框两次,则另一个div会向上滑动。所以然后一个div上升而另一个下降。

$("#myCheckbox").click(function() {
    if ($("#myCheckbox").is(":checked")) { // Now is checked.
        $.when($("#myDiv2").slideDown(slow)).done(function() {
            $("#myDiv1").slideDown(slow);
        });
    }
    else { // Now is unchecked.
        $.when($("#myDiv2").slideUp(slow)).done(function() {
            $("#myDiv1").slideUp(slow))
        });
    }
}

1 个答案:

答案 0 :(得分:1)

答案1.如果这些动画当前正在运行,请禁用该复选框或停止执行代码

答案2.为每个动画制作一个内置队列,因此,不是直接在任何内容上调用slideUp或slideDown,而是将“slideUp”或“slideDown”添加到数组中以充当队列。让队列检查自己并在需要时使用某种游戏循环或计时系统运行所需的slideUp或slideDown。

答案3.如果该功能当前正在运行,则添加0.1秒延迟,然后检查它当前是否正在运行,继续这样做直到它当前没有运行,然后执行。如果它当前正在运行并且第二次执行当前正在检查它何时可以运行,则取消第二次执行。 Aka,如果他们快速点击三次,它将只运行第一个动画,因为第二次和第三次点击将相互抵消

如果有帮助,我会添加一些代码