keyup(function()) ajax请求延迟 - jQuery

Question

我有一个jQuery Ajax请求，想要通过文本输入来调用它，所以我将其嵌套在keyup(function()中。这样做是有效的。

$("#text_box").keyup(function() {
 //AJAX REQUEST
});

但是有时候它的表现会有些问题。当我快速输入一些文本时，我得到的结果会省略原始输入单词的一些最后字母(可能是浏览器出了点问题)。我希望在一秒钟内没有输入活动时发送ajax请求，也就是说，如果我快速输入文本并停顿一秒钟(表示我已经完成了输入)，那么ajax请求应该被发送。我该怎么做呢？

- Alfred

---

今天实际上已经有一个几乎完全相同的问题被提出了：https://dev59.com/mGTWa4cB1Zd3GeqPDXJt - lanzz

您可以在这里查看：https://dev59.com/0XI-5IYBdhLWcg3wVWvv - Zernel

Answer 1

看起来你是从之前的ajax调用中获取了结果。使用setTimeout和clearTimeout设置一个定时器。

var timer = null;

$("#text_box").keyup(function() {
  if(timer) {
    clearTimeout(timer);
  }

  timer = setTimeout(someFunction, someDelay);
});

在用户输入之后，someDelay毫秒后执行ajax调用的函数为someFunction。

- Linus Thiel

Answer 2

由于您已经在使用jQuery，因此可以使用来自Ben Aleman的debounce插件。

以下是页面上的示例：

// Bind the not-at-all debounced handler to the keyup event.
  $('input.text').keyup( text_1 );

  // Bind the debounced handler to the keyup event.
  $('input.text').keyup( $.debounce( 250, text_2 ) ); // This is the line you want!

- Andreas

Answer 3

哦我的天。对于那些在2014年进行搜索的人...

function sendAjax() {
    setTimeout(
        function() {
            $.ajax({
                url: "url.php",
                type: "POST",
                data: data,
                success: function(data) {
                    $("#result").html(data);
                }
            });
        }, 2000);
}

<input onkeyup="function()">

- Евгений Антипов