使用Ajax和keypress优化搜索-OptimisedsearchusingAjaxandkeypress

78  

You can do something like this:

你可以这样做：

$('#searchString').keyup(function(e) {
    clearTimeout($.data(this, 'timer'));
    if (e.keyCode == 13)
      search(true);
    else
      $(this).data('timer', setTimeout(search, 500));
});
function search(force) {
    var existingString = $("#searchString").val();
    if (!force && existingString.length <3) return; //wasn't enter, not > 2 char
    $.get('/Tracker/Search/' + existingString, function(data) {
        $('div#results').html(data);
        $('#results').show();
    });
}

What this does is perform a search (on keyup, better than keypress for these situations) after 500ms by storing a timer on the #searchString element's .data() collection. Every keyup it clears that timer, and if the key was enter, searches immediately, if it wasn't sets a another 500ms timeout before auto-searching.

这样做是通过在#searchString元素的.data（）集合上存储计时器，在500ms之后执行搜索（在keyup上，比这些情况下的keypress更好）。每个键盘清除该计时器，如果键输入，立即搜索，如果它没有在自动搜索之前设置另一个500ms超时。

3  

See this older question:

看到这个老问题：

How do I make my live jQuery search wait a second before performing the search?

在执行搜索之前，如何使我的实时jQuery搜索等待一秒钟？

1  

What I would do is each key press use a setTimeout function with the desired delay. So that function will fire after that timeout. Each key press then delete the timer and set a new one, with clearTimeout();

我要做的是每次按键使用具有所需延迟的setTimeout函数。因此该函数将在超时后触发。每按一次键然后删除定时器并设置一个新定时器，使用clearTimeout（）;

See here for some examples, scrolling past all the adverts.

在这里查看一些示例，滚动浏览所有广告。

http://www.elated.com/articles/Javascript-timers-with-settimeout-and-setinterval/

http://www.elated.com/articles/Javascript-timers-with-settimeout-and-setinterval/