javascript - 如何触发延迟到用户暂停输入的 onkeyup 事件？

Question

我有一个文本区域，人们可以在其中输入一些文本(自然地)，我想这样做以便时不时地发出 AJAX 请求以获取有关文本区域内容的一些建议(例如堆栈溢出的相关问题，但对于文本区域，而不是文本输入)。问题是我不能在每次按键时都执行 AJAX 请求(这是无用的并且非常耗费资源)，而且我不确定最有效的方法是什么(每 X 个字？每 X 秒) ？还是别的什么？)。

执行此操作的最佳方法是什么？

提前谢谢你。

Answer 1

您可以将 keypress 事件处理程序与 setTimeout 结合使用，这样您就可以在按键后一段时间后发送 Ajax 请求，如果再次按键则取消并重新启动计时器在定时器结束之前发生。假设您有一个 ID 为“myTextArea”的文本区域和一个名为 doAjaxStuff 的 Ajax 回调函数:

function addTextAreaCallback(textArea, callback, delay) {
    var timer = null;
    textArea.onkeypress = function() {
        if (timer) {
            window.clearTimeout(timer);
        }
        timer = window.setTimeout( function() {
            timer = null;
            callback();
        }, delay );
    };
    textArea = null;
}

addTextAreaCallback( document.getElementById("myTextArea"), doAjaxStuff, 1000 );