Question

我正在开发一个创建滑动按钮类型效果的脚本。五个div位于彼此旁边，每个都有一个链接。当点击其中一个DIVS时，相关内容将被扩展，其余的Div将被关闭。

问题是，如果用户在加载时点击Div两次或快速连续点击另一个Div，则会出现裂缝。

我想知道是否可以只允许查询执行一次并等到完成而不是排队。

这是我目前的代码，如果它是废话随意评论我怎么能更好...我不是最好的Javascript / jQuery：P

    function mnuClick(x){
    //Reset all elements
    if($('#'+x).width()!=369){
        $('.menu .menu_Graphic').fadeOut(300);
        $('.menu_left .menu_Graphic').fadeOut(300);
        $('.menu_right .menu_Graphic').fadeOut(300);
        $('.menu').animate({width: "76px"},500);
        $('.menu_left').animate({width: "76px"},500);
        $('.menu_right').animate({width: "76px"},500);
    }
        var ElementId = '#' + x;

        $(ElementId).animate({
            width: 369 + "px"
        },500, function(){ 
            $(ElementId + ' .menu_Graphic').fadeIn(300);
        });
}

提前致谢，克里斯。

Answer 1

您需要一个“isRunning”标志。在开始之前检查它。在开始序列时设置它，在它结束时清除它。

Answer 2

(function() {
var mutex = false;

    function mnuClick(x){
        if (!mutex) {
           mutex = !mutex;

           /* all code here ...   */

           mutex = !mutex; /* this statement should go into animation callback */
        }

    }

})();

通过变量维护状态，因此在代码完全执行之前不能多次单击

Answer 3

你可以在事件启动时拔掉onClick事件处理程序（mnuClick），以有效地禁止调用mnuClick两次，但一定要在事件结束时恢复它。

Answer 4

快速回答：使用.addClass和.removeClass并在执行时测试是否存在类。测试它是否已设置并返回或添加，执行代码，然后将其删除。

Answer 5

你可以创建一个不可见的maskin和maskout（比如灯箱中的背景等）或禁用点击直到动画结束。

防止Javascript被执行两次

5 个答案: