javascript - 在脚本执行完成之前阻止下一个 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

一旦 keydown 事件发生，您可以取消绑定事件：

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

然后在动画完成后重新绑定down函数（可能作为回调）。

如果您对绑定/重新绑定不感兴趣，并且不喜欢 icky 全局变量，您可以使用一个类来指示动画是否正在进行中：

  $(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 2

保留一些变量并检查它

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 3

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

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；

Answer 4

基于 Asad 回答的解决方案：

$(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 5

您无法阻止事件触发，但您可以忽略它：

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.
        }
    }
});