使用javascript/jQuery在2秒后触发事件

Question

我有类似的要求,如jquery-run-code-2-seconds-after-last-keypress.

现在,当我使用@brad代码时,它可以正常工作: -

$('input.username').keypress(debounce(function (event) {
    console.log('Search keypress');
}, 250));

但不是在: -

$('#search').keypress(function () {
    debounce(function (event) {
        console.log('Search keypress');
   }, 2000);
});

小提琴这里.任何帮助都会非常有用.

编辑:-

最初我做了类似下面的事情,这不是我想要的 -

$('#search').keypress(function () {
    setTimeout(function () {
      console.log('Search keypress');
    }, 3000);
});

编辑2: - 我想要一些非常类似于下面的东西: - (从那里复制的文字)

在输入3个字符后,它将在每次按键时搜索.

我想要的是

案例1:
用户输入测试
2秒后执行搜索

---

情况2:
用户输入测试
1秒通过
用户按t
2秒
测试通过搜索

---

案例3:
用户输入测试
1秒通过
用户按下t
1.5秒通过
用户按下i
1.5秒通过
用户按下n
1.5秒通过
用户按g
2秒通过
搜索执行测试

如您所见,搜索操作仅在按键后两秒内没有按键(或粘贴等)时执行.

我的基本想法是.

on keydown调用一个设置超时的函数,该函数还设置一个包含文本框中最后一个条目的变量.当超时到期时,它会检查框中的值以查看它是否与变量中的值匹配.

Answer 1

要使用超时去除它:

{BTW,使用keyup事件代替keypress,delete key不会触发keypress事件,请参阅:http://www.quirksmode.org/js/keys.html }

DEMO

var timer;
$('#search').keyup(function () {
    clearTimeout(timer);
    timer = setTimeout(function (event) {

        console.log('Search keypress');
        var text = $('#search').val();

        $('#textTobeSearched').text(text);
    }, 2000);
});

Answer 2

更新:这是2秒钟的去抖(等待2秒):小提琴

$('#search').keyup( debounce(function() {
       console.log('Search keypress');
        var text = $('#search').val();

        $('#textTobeSearched').text(text); 
    }, 2000));

使用setTimeout

$('#search').keypress(function() {
    setTimeout(function() {
        console.log('search keypress');
    }, 2000);
});