javascript - 在 KeyUp 和粘贴事件上限制 AJAX 请求

Question

所以我在文本框上的 jQuery 中对每个 keyup 和 paste 事件调用 AJAX 请求:

 $("#server-label").bind("keyup paste", function() {
     $.ajax()...
 });

问题是，如果用户快速按键，AJAX 请求太多了。在调用 AJAX 请求之前等待用户停止输入一段时间(比如 500 毫秒)的最佳方法是什么。基本上不要发出 AJAX 请求，直到 500 毫秒内没有触发任何键或粘贴事件。

谢谢。

Answer 1

尝试使用 setTimeout() 和一个 timer 变量来跟踪它:

var t;
$("#server-label").on("keyup paste", function() {
    clearTimeout(t);
    t = setTimeout(function() {
        $.ajax({/*[...]*/});
        //...
    }, 500);
});

你也可以使用 throttle 或 debounce但我认为如果您将代码包装在函数对象或字符串中以传递给 setTimeout() 函数，则没有必要。