Question

我有一个输入，用户输入一个搜索参数，此时我在keyup上有一个POST ajax请求到一个返回搜索结果的PHP脚本。然而它在大约10秒内（如用户输入的那样）发出500亿（不是字面意思）的发布请求，这会减慢整个体验。我可以通过检测空格键的使用来使用jQuery来检测“wordup”而不是“keyup”吗？

这有意义吗？

Answer 1

我将此作为单独的答案添加，因为它与我的第一个答案完全不同。

$('#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);
});

Answer 2

$('#yourinput').keyup(function(e) {
    if (e.which == 32) { // space key pressed
        // do your AJAX here
    }
});

有关此功能的详情，请参阅event.which。

Answer 3

当用户在特定时间段内停止输入时，您可以使用类似延迟的内容吗？

也许是这样的？您可以添加附加功能以触发空格键。（这仅用于Google风格的insta-search，因此它可能/可能没有帮助。）

$('#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);
};
})();

Answer 4

你当然可以;你在本地检测到keyup事件并检查它们是否有空间。

但是如果您可以设法获得与前缀匹配的所有搜索结果并将其发送到数据结构中的javascript，那么您将获得更多的杠杆作用。有关详细信息，请查看“数字搜索树”（也称为“尝试”）。

jQuery检查wordchange而不是“更改”触发器

4 个答案: