阻止下一次keydown事件，直到脚本执行完成

Question

我想禁用keydown事件发生，直到keydown事件内的脚本完成执行。

$(document).keydown(function(e){ 
     if (e.keyCode == 40){ 
      down(); //Assume down has some animate function executes for 1sec 
     } 
    }); 

当前，当我按下键并保持不释放，keydown事件反复发生，我想禁用它。任何帮助将不胜感激

Answer 1

解决方案基于阿萨德回答：

$(document).keydown(function(e){ 
    if($('body').hasClass('animating')){ 
     //DO NOTHING 
    } 
    else{ 
     if (e.keyCode == 40){ 
      down(); //Assume down has some animate function executes for 1sec 
      $('body').addClass('animating'); 
     } 
    } 
}); 


$(document).keyup(function(e){ 
    $('body').removeClass('animating'); 
}); 

Answer 2

一旦keydown事件发生时你可以取消绑定事件：

$(document).keydown(function(e){ 
     if (e.keyCode == 40){ 
      down(); //Assume down has some animate function executes for 1sec 
      $(document).unbind('keydown'); 
     } 
    }); 

然后在down功能，一旦重新绑定在完成动画（如回调，可能）。

如果你不感兴趣的绑定/重新绑定，不喜欢过甜的全局变量，你可以使用一个类来表示动画是否正在进行：

$(document).keydown(function(e){ 
     if (e.keyCode == 40 && $('body').is(':not(.animating)')){ 
      down(); //Assume down has some animate function executes for 1sec 
      $('body').addClass('animating'); 
     } 
    }); 

然后将其删除一旦动画已经完成，就以同样的方式执行功能down。

Answer 3

你不能阻止触发事件，但是你可以忽略它：

var keyIsDown = false; 
$(document).keydown(function(e){ 
    if(!keyIsDown) { 
     keyIsDown = true; 
     if (e.keyCode == 40){ 
      down(); //Assume down has some animate function executes for 1sec 
      // set keyIsDown = false; on the animation callback, inside down func. 
     } 
    } 
}); 

Answer 4

保持一些变量，并检查它也

var isAnimating = false; 
$(document).keydown(function(e){ 
    if (!isAnimating && e.keyCode == 40){ 
     isAnimating = true; 
     down(); //Assume down has some animate function executes for 1sec 
     isAnimating = false; 
    } 
}); 

Answer 5

绑定和重新绑定是昂贵的。只需跟踪动画是否正在处理变量，并在再次执行前检查：

var animating = false; 

$(document).keydown(function(e){ 
    if (e.keyCode == 40 && !animating){ 
     down(); //Assume down has some animate function executes for 1sec 
     animating = true; 
    } 

}）;

然后，您可以使用具有适当延迟的settimeout将动画设置恢复为false;