我有一个用户输入搜索参数的输入,目前我在 keyup 上有它对返回搜索结果的 PHP 脚本执行 POST ajax 请求。然而,它在大约 10 秒内(当用户键入时)触发了 500 亿个(不是字面意思)发布请求,这减慢了整个体验。我可以使用 jQuery 通过检测空格键的使用来检测“wordup”而不是“keyup”吗?
这有意义吗?
我将此添加为单独的答案,因为它与我的第一个答案完全不同。
$('#yourinput').keyup(function(){
var input = this,
timer = $.data(this, 'timer'),
lastrequest = $.data(this, 'lastrequest');
if (timer) { // if there is a keyup timeout still pending, cancel it
clearTimeout(timer);
$.data(this, 'timer', 0);
}
if (lastrequest) { // if there is an AJAX request still running, abort it
lastrequest.abort();
$.data(this, 'lastrequest', false);
}
timer = setTimeout(function(){
lastrequest = $.post({ // or whatever your AJAX call is...
url: 'yourfile',
data: { search: input.value },
success: function(response){
lastrequest = false;
// handle response here
}
});
$.data(input, 'lastrequest', lastrequest);
}, 500);
$.data(this, 'timer', timer);
});
$('#yourinput').keyup(function(e) {
if (e.which == 32) { // space key pressed
// do your AJAX here
}
});
有关此功能的更多信息,请参阅event.which
。
当用户在特定时间段内停止输入时,您可以使用延迟之类的东西吗?
也许是这样的?您也可以添加附加功能来触发空格键按下。(这仅用于 Google 风格的 insta 搜索,因此它可能/可能没有帮助)。
$('#Search').keyup(function (event)
{
delay(function(){
var textboxValue = $('#Search').val();
if( textboxValue.length >= 2)
{
//Perform search
}
});
});
var delay = (function(){
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
你当然可以;您在本地检测 keyup 事件并检查它们是否有空间。
但是,如果您能够设法获取与前缀匹配的所有搜索结果并将它们发送到数据结构中的 javascript,您将获得更多的影响力。查看“数字搜索树”(也称为“尝试”)了解详细信息。