javascript - onkeup 后的 javascript 延迟

Question

所以参考这个： 如何延迟 .keyup() 处理程序直到用户停止输入？

我想出了以下代码。但它什么也没做......有什么建议吗？

如果用户进一步键入内容，我试图让 setTimeout 取消，这样就不会发生多个警报，只有当用户最终“停止”时才会发生警报（希望如此）。

谢谢！！

var t = 0;  
$('input').keyup(function(){
    clearTimeout(t);
    t = setTimeout(alert($('input').val()),1000);
}

Answer 1

代替

t = setTimeout(alert($('input').val()),1000);

和

t = setTimeout(function(){alert($('input').val())},1000);

您将输入的值传递给 setTimeout，而setTimeout需要一个函数（或它可以作为代码评估的字符串）作为第一个参数。

并将最后一行替换为，});以便代码编译。

示范

Answer 2

您无法获取元素列表的 .val() 。$('input') 正在选择屏幕上的所有输入，并且只会给出列表中第一个输入的值。

此代码应适用于所有输入，但仅在触发事件的那个上运行超时。

var t = 0;  
$('input').keyup(function(){
    var that = this;

    clearTimeout(t);
    t = setTimeout(function() {
        alert($(that).val());
    }, 1000);
}

我希望这有帮助！

Answer 3

为了防止在几个不同的输入上混淆，使用this参考，保持超时data()：

var out = $('#out');
$('input').keyup(function() {
    var $this = $(this);
    clearTimeout($this.data('timeout'));
    $this.data('timeout', setTimeout(function() {
        out.append($('<div>').text(($this.attr('id') + ': ' + $this.val())));
    }, 1000));
});​

演示