'keyup' 事件的更好选择答案

【问题标题】：Better Alternative to 'keyup' Event'keyup' 事件的更好选择
【发布时间】：2015-07-24 05:53:51
【问题描述】：

我有一个输入文本框，它使用 Autocompleter Plugin 用于 Mootools 通过 AJAX 自动填充。

我目前正在使用“keyup”事件通过 AJAX 获取结果。 它可以工作，但我觉得它充其量只是有点笨拙，因为每次键盘按下都会产生一个 AJAX 请求。

我宁愿在用户完成输入后只发出 ONE AJAX 请求，就像用户暂停一会儿之后一样。

我尝试了 'change' 事件，但更糟糕的是，我不得不点击离开输入文本框以发出 AJAX 请求，然后再次点击输入文本框让“onComplete”启动。

这是我的代码：

input.addEvent('keyup', function(e) {
    new Autocompleter.Request.JSON(input.getProperty('id'), url, {
        'postVar': 'search',
        'maxChoices': 6,
        'overflow': false,
        'selectMode': 'pick',
        'delay': 100,
        'forceSelect': false,
        onRequest: function() {
            // do nothing
        },
        onComplete: function() {
            // do nothing
        }
    });
});

希望你们能理解我的问题。

谢谢！

【问题讨论】：

@sergio 所说的是正确的方法。 debounce - 您也可以将键查找缓存作为一个小哈希图引入，以便保存对您已经查询的字符串的重复调用。

标签： javascript ajax autocomplete mootools

【解决方案1】：

将选项 'delay': 100, 更改为更大的数字。

【讨论】：

这没有提供问题的答案。要批评或要求作者澄清，请在其帖子下方发表评论。
@Krumia 是的。用户正在使用具有选项delay 的自动完成插件，用于延迟插件直到输入完成。也供参考：stackoverflow.com/questions/30206436/…
请将这些信息添加到答案和解释中。您提供的参考是同一个问题。您确定您发布的链接正确吗？
@Krumia 这是正确的链接。它在已删除的帖子上，只有 10K 用户可以看到。那里的作者或问题将其称为解决方案。

【解决方案2】：

执行 on keypress 功能，然后根据需要冻结该功能几秒钟

代码：

input.addEvent('keyup', function(e) {
    setTimeout(function(){
        new Autocompleter.Request.JSON(input.getProperty('id'), url, {
            'postVar': 'search',
            maxChoices: 6,
            overflow :false,
            'selectMode': 'pick',
            delay : 100,
            forceSelect:false,
            onRequest: function() {
                // do nothing
            },
            onComplete: function() {
                // do nothing
            }
        });
    },2000); //1000 = 1sec
});

希望它能解决您的问题，正如您在问题中所说的“我宁愿在用户完成输入后只发出一个 AJAX 请求，就像在用户暂停一段时间后一样。”

更多信息请评论。

谢谢...

【讨论】：