在jQuery中调用事件调用

Question

我有一个keyup事件绑定到一个需要大约四分之一秒才能完成的函数.

$("#search").keyup(function() {
  //code that takes a little bit to complete
});

当用户键入整个单词或快速按下键时,该功能将连续多次调用,并且需要一段时间才能完成.

有没有办法限制事件调用,以便如果有几个快速连续,它只触发最近调用的那个？

Answer 1

看看jQuery Debounce.

$('#search').keyup($.debounce(function() {
    // Will only execute 300ms after the last keypress.
}, 300));

Answer 2

这是一个不需要插件的潜在解决方案.使用布尔值来决定是否执行keyup回调,或跳过它.

var doingKeyup = false;

$('input').keyup(function(){
    if(!doingKeyup){
        doingKeyup=true;
        // slow process happens here
        doingKeyup=false;
    }
});

Answer 3

你也可以使用优秀的Underscore/_库。

Josh 的回答中的评论，目前最流行的，争论您是否真的应该限制通话，或者是否需要一个 debouncer。区别有点微妙，但 Underscore 同时具有:_.debounce(function, wait, [immediate])和_.throttle(function, wait, [options]).

如果您还没有使用 Underscore，请检查一下。它可以让你的 JavaScript 更简洁，并且足够轻量级，让大多数库讨厌者停下来。