我可以延迟jquery的keyup事件吗？
我正在使用rottentomatoes电影API和twitter的typeahead插件使用bootstrap 2.0。 我已经能够整合API，但我遇到的问题是在每个keyup事件之后调用API。 这一切都很好，但是我宁愿在一个小暂停之后拨打电话，让用户先输入几个字符。
以下是我在keyup事件后调用API的当前代码：
var autocomplete = $('#searchinput').typeahead() .on('keyup', function(ev){ ev.stopPropagation(); ev.preventDefault(); //filter out up/down, tab, enter, and escape keys if( $.inArray(ev.keyCode,[40,38,9,13,27]) === -1 ){ var self = $(this); //set typeahead source to empty self.data('typeahead').source = []; //active used so we aren't triggering duplicate keyup events if( !self.data('active') && self.val().length > 0){ self.data('active', true); //Do data request. Insert your own API logic here. $.getJSON("http://api.rottentomatoes.com/api/public/v1.0/movies.json?callback=?&apikey=MY_API_KEY&page_limit=5",{ q: encodeURI($(this).val()) }, function(data) { //set this to true when your callback executes self.data('active',true); //Filter out your own parameters. Populate them into an array, since this is what typeahead's source requires var arr = [], i=0; var movies = data.movies; $.each(movies, function(index, movie) { arr[i] = movie.title i++; }); //set your results into the typehead's source self.data('typeahead').source = arr; //trigger keyup on the typeahead to make it search self.trigger('keyup'); //All done, set to false to prepare for the next remote query. self.data('active', false); }); } } }); 是否可以设置一个小延迟并避免在每个键盘后调用API？
它可以像这样轻松完成：
var autocomplete = $('#searchinput').typeahead().on('keyup', delayRequest); function dataRequest() { // api request here } function delayRequest(ev) { if(delayRequest.timeout) { clearTimeout(delayRequest.timeout); } var target = this; delayRequest.timeout = setTimeout(function() { dataRequest.call(target, ev); }, 200); // 200ms delay }
通常，这可以通过setTimeout和clearTimeout方法实现：
var timer; $('#textbox').keyup(function() { if (timer) { clearTimeout(timer); } timer = setTimeout('alert("Something cool happens here....");', 500); });
setTimeout将在指定的时间间隔（以毫秒为单位）后执行提供的javascript。 clearTimeout将取消此执行。
我还准备了jsFiddle演示，展示了代码片段。
参考文献：
- Javascript计时方法
对于使用typeahead.js的v0.11并使用Bloodhound获取远程建议的人，您可以使用rateLimitWait选项来限制请求：
var search = new Bloodhound({ datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), queryTokenizer: Bloodhound.tokenizers.whitespace, remote: { url: '/search?q=%QUERY', rateLimitWait: 500 } });
不确定Bootstrap 2.0用于typeahead的版本，但v0.9.3有一个隐藏在引擎盖下的minLength选项，但没有记录。
$('#people').typeahead({ name: 'people', prefetch: './names.json', minLength: 3 });
从这篇博文中可以找到： http ： //tosbourn.com/2013/08/javascript/setting-a-minimum-length-for-your-search-in-typeahead-js/
如果您只是想让用户在ajax $ .getJSON请求之前输入几个字符，而不是延迟，您可以修改if语句，以便用户必须输入最少数量的字符，例如3您请求数据：
if( !self.data('active') && self.val().length >=3){