javascript - JQUERY 防止连续的键盘按键事件，该怎样实现？

Question

一个左右滚的动态效果，由左、右方向键触发。
怎样在某段时间内连接按键而只触发一次事件？

Answer 1

Underscore 或者 Lodash 的 _.throttle 方法就是干这事用的.

Answer 2

var _timer = {};
function delay_till_last(id, fn, wait) {
    if (_timer[id]) {
        window.clearTimeout(_timer[id]);
        delete _timer[id];
    }

    return _timer[id] = window.setTimeout(function() {
        fn();
        delete _timer[id];
    }, wait);
}

////////////////////////////////////
$el.on('click', function() {
    delay_till_last('myclick', function() {
        // run something
    }, 500);
});

这个写法可以保证只有最后一次点击被触发，方法就是后一次事件会覆盖前一次事件，如果超过指定时间还没有新的事件，就执行最后一个事件

delay_till_last()这个函数是我在前端很常用的函数，用在用户可能密集输入的场合下，比如文本框持续输入，等到输入完毕再开始检查

$input.on('keypress', function() {
    // 用户停止输入300ms后开始检查
    delay_till_last('check_input', function() {
        // 检查文本框内容是否正确
    }, 300);
});

Answer 3

一般做的时候就是第一次触发后把事件解绑等滚动完成后在从新绑上。

Answer 4

或者按照游戏里的思路是用

setInterval(function(){
  if(keyup.left){
    // something
  }
},time);

Answer 5

用一个全局变量做时间戳，按下的时候判断和上一次时间戳的差，大于某个值才执行动作，并且更新时间戳。
这样做，用户如果按住键盘也会触发多次事件，只是间隔会是你设定的时间，比如0.5秒。大部分单次点击应该可以应对。

Answer 6

http://benalman.com/code/projects/jquery-throttle-debounce/examples/debounce/