Scope order issue with JavaScript code execution?

Question

var mark2=true;
$(".right").click(function(){

        if(mark2){
           move(1);
           mark2=false;
        }
    })

function move(obj){

             obj.animate({
                    width: arrW[index],
                     height: arrH[index],
                    opacity: arrO[index],
                    left: arrL[index],
                    top: arrT[index]

                },500,function(){
                    mark2=true;
                })
                }
                

Click $(".right") to execute the move function, mainly to add animation to the obj element. In order to prevent $(".right") from clicking too fast and overlapping the animation, mark2 is used to control it. When the animation execution is completed, that is, mark will be true after 500 milliseconds. Click $(".right") to execute, otherwise it will not execute. But I have a question, that is, when the click speed is greater than 500 milliseconds, in the if statement There is no chance for the mark to be executed, and it is clicked again. Doesn’t that mean the animation is always superimposed? Because mark is always true, it seems that my understanding is wrong, because the program can be executed normally, so I hope someone can give me some guidance on the execution process of the program

Answer 1

I understand that the core of your problem is that the click speed is greater than 500ms. This is the case. The click event will only be triggered after the mousedown mouseup event is triggered successively on the same element. move() will be executed only after the click event is triggered

So the timeout situation you are considering will not happen.

Answer 2

If you want to use variable control, it is best to move mark2 to the top to make it easier to understand. The process is like this:
If you:
Click right -----》Run asynchronous animation-----》mark2 = false ----(after 0.5s)----》mark2 = true;

So no matter how you click, whether it is greater than 0.5s or less than 0.5s, unless the animation has finished running and mark2 is true, the if condition will not enter at all