Question

我是新来的，所以请放轻松我。这有点令人困惑。：）

我正在处理搜索输入，其中用户在搜索文本框中输入另一个用户的名称（或名称的一部分），然后返回与该搜索字符串匹配的用户列表。问题是当涉及成千上万的用户时，它有点慢。由于这种缓慢，当用户在搜索输入中快速输入名称时，屏幕将开始闪烁每个键击的搜索结果（在用户已经输入搜索字符串之后）。这就像一个严重延迟的反应。

例如，如果我输入名称'Wendy'，搜索字符串'W'（我输入的第一个字符）的搜索结果甚至都不会显示。然后将显示字母“W”的搜索结果，然后显示“我们”，依此类推，即使我已经输入了全名，只是想看到'Wendy'的结果。

我想要做的只是当用户在一段时间内没有输入任何东西时进行搜索（我想的是两秒钟）。否则，将显示“搜索”一词。 Javascript方法的代码如下。就像一个注释，该代码目前用于搜索用户，我只需要实现延迟执行。

function updateSearchResults() {
    if($F('searchString').length > 0){
        Element.update($('searchResultsScrollBox'), '<h3>Searching...</h3>'); 
        $('searching').style.display = 'block';
        var url = '<c:url value='ajaxFrontGetUsers.html'/>';
        var ajax = new Ajax.Updater({success: 'searchResults'}, url,
        {method: 'post', parameters: $('searchForm').serialize(true)});
         $('searching').style.display = 'none';
     }
}

我希望这一切都有道理。提前感谢任何可以提供帮助的人。

Answer 1

请尝试以下步骤：

每隔几毫秒，检查一下文本框中是否有新数据。
如果文本框有新文本，请执行Ajax，并将文本复制到变量（在步骤1中进行比较）。

如果要从那里提高性能，请在用户键入内容时激活计时器，并在进行Ajax调用时将其停用。

Answer 2

嘿，谢谢你的回答。我最终设置了500毫秒的间隔，其中javascript函数将持续检查以查看在500毫秒时间段内是否在搜索字符串中输入了新字符。如果是，则调用搜索功能以搜索用户输入的字符串。否则，它会再等500毫秒，直到用户停止输入。最后，它与你提出的非常相似。再次感谢！

Answer 3

或者你可以在清除某些全局变量的项目上放置一个“onkeypress”事件处理程序，或取消一个计时器以防止AJAX事件被触发。我知道Prototype通过它的就地编辑器和“频率”选项为你实现了这一点。（我相信它会设置一个超时计时器，它会在每次按键后取消。）

Answer 4

我知道这是一个古老的问题，但对于其他人来看，我认为你的做法是错误的。我认为你应该对每个ajax调用进行日期/时间标记，并在你的javascript中跟踪数据时间戳。然后，当返回ajax调用时，您可以检查日期/时间戳并确保它是最重新发送的ajax调用的结果集。通过这种方式，您可以立即对每次击键进行ajax调用，但只有在ajax结果符合键入时才会显示结果。

另外，您是否发送了所有匹配结果？只有字母W的数千？为了加快javascript方面，你可能应该在数据库中对结果进行排名并仅返回前10-20。不管怎么说，不希望看到超过10-20个结果。

此外，您的SQL查询是否最佳？好像查询花了太长时间。如果你做一个像搜索这样的单方面（即。like input+'%'）而不是像搜索这样的双面（即like '%' + input + '%'），那么你可以在桌面上找到一些非常好的索引来帮助你。

用户在几秒钟不活动后执行ajax代码

4 个答案: