Geek Answers Handbook

Prevent Javascript Execution Twice

I have a script that I am developing that creates an effect like a sliding button. Five divs are located next to each other, each with a link. When one of these DIVS is clicked on related content, it expands and the rest of the Div closes.

The problem is that if the user double-clicks the Div when it loads or clicks on another Div in quick succession, cracks begin to appear.

I am wondering if it is only possible to allow the request to be executed once and wait for the completion, not its queue.

Here is my current code, if it's shit, feel free to comment on how I could improve it ... I'm not the best of 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);
        });
}

Thanks in advance, Chris.

+5
5

isRunning. . , , , .

+9
(function() {
var mutex = false;

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

           /* all code here ...   */

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

    }

})();

mantain , ,

+3

onClick (mnuClick) , mnuClick , , .

+1

: .addClass .removeClass . , , , , .

+1
source

you can create an invisible mask and disguise (for example, a background in a lightbox, etc.) or turn off clicks until the animation ends.

0
source

More articles:


All Articles