jquery键盘功能之间的延迟

Question

我有一些代码，我正在写，试图在我的网站与即时搜索结果融合bing搜索API。我使用jquery的keyup函数将数据发送到我的服务器端脚本，然后获取bing search xml并显示结果。

我担心的是，我会让我的脚本太多无情的命中。 有人可以看看这个，并告诉我如何我可以把键盘之间1秒的延迟作为一个计时器？所以它只会每隔一秒左右更新一次reults

这是我迄今为止创造的，但我不知道它的正确吗？

<script type="text/javascript"> 
var delay = (function() { 

    var timer = 0; 

    return function(callback, ms) { 

     clearTimeout(timer); 

     timer = setTimeout(callback, ms); 

    }; 

})(); 



function reloadsearch() { 
    var searchterms = $('#q').val(); 
    if (searchterms.length >= 3) { 
     delay(function() { 
      var data = 'source=ajax&q=' + searchterms; 
      $.ajax({ 
       type: "GET", 
       url: "results/", 
       data: data, 
       success: function(html) { 
        if (html !== '') { 
         $("#search-results").html(html); 
         $("#search-results").fadeIn(500); 
        } 
       } 
      }); 
     }, 250); 
    } 

    else 

    { 
     $("#search-results").fadeOut(250); 
    } 
}; 



$('#q').keyup(function() { 
    reloadsearch() 
}); 

$(document).ready(function() { 
    reloadsearch() 
}); 

Answer 1

这里是采取输入和以较慢的速率打字搜索的输入框的例子。

http://jsbin.com/ebela4/8/edit

这个例子没有做阿贾克斯片，但你会得到的想法。尝试尽可能快地在输入框中输入内容。它会以更新的速度更新搜索框。它记得国家是'肮脏'，然后在必要时刷新。

希望这能让你开始。

鲍勃

Answer 2

我会做这样

var delay = false; 
$('#q').keyup(function() { 

if(!delay){ 
    delay = true; 
    reloadsearch().delay(1000); 
    delay = false; 
}); 

什么逻辑它应该工作，但我没有放弃一试！ syntex可能需要一些更改。

这里是代码，这将有助于你这个希望和平码;）

$(document).ready(function(){ 

function reloadsearch() { 
    var searchterms = $('#q').val(); 
    if (searchterms.length >= 3) { 

      var data = 'source=ajax&q=' + searchterms; 
      $.ajax({ 
       type: "GET", 
       url: "results/", 
       data: data, 
       success: function(html) { 
        if (html !== '') { 
         $("#search-results").html(html); 
         $("#search-results").fadeIn(500); 
        } 
       } 
      }); 
     } 

    else 

    { 
     $("#search-results").fadeOut(250); 
    } 
}; 

var delayOn = false; 
$("#test").click(function(){ 
if(!delayOn){ 
delayOn = true; 
reloadsearch().delay(2000).queue(function(){delayOn = false;$(this).dequeue();}); 
     } 
        }); 
       }); 

Answer 3

这是一个类似于谷歌搜索的例子。直到用户暂停输入后才会搜索。

http://jsfiddle.net/WNX5q/