jquery - 如何解决实时搜索的 "lag"问题？

Question

嗨，我正在我的网络应用程序中实现实时搜索(=输入时搜索)功能。目前我正在使用 keyup 事件通过 ajax post 发送搜索请求，例如

$('#SearchField').keyup(function(e) {
        $.post(
           ...
        );
});

但这会导致某种滞后问题，在某些情况下，当我搜索时，例如在“问题”之后，“pro”的响应显示在“问题”的响应之后，并用以下内容覆盖正确的搜索结果取得重大成果的方法。

打击这种行为的好方法是什么？

蒂亚

Answer 1

您可以中止之前的请求

var xhr = null;
$('#SearchField').keyup(function(e) {
  if (xhr !== null) xhr.abort ();
  xhr = $.post(
    ...
  );
});

或者为每个请求设置分配ID。当请求完成时，如果更大的 id 已经返回，则忽略答案。否则，存储 id。