JQuery延迟键控搜索

我将此代码隐藏每个

.flip

元素，但我搜索的元素除外：

var $rows = $('.flip'); 
$('#search').keyup(function() 
{
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();  
    $rows.show().filter(function()                                      
    {
        var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(val);
    }).hide();  
}); 

问题是，每次我释放密钥时，它都会进行搜索。我怎样才能等到我停止打字

---

谢谢

只需使用

setTimeout

$（文档）.ready（函数（）{
无功定时器；
var$rows=$（'.flip'）；
var$self=$（本）；
$（“#搜索”）.keyup（函数（）{
清除超时（计时器）；
计时器=设置超时（函数（）{
$（'#test'）.text（Math.floor（Math.random（）*1000））；
var val=$.trim（$self.val（））.replace（+/+/g'，）.toLowerCase（）；
$rows.show（）.filter（函数（））{
var text=$（this.text（）.replace（/\s+/g'，）.toLowerCase（）；
return！~text.indexOf（val）；
}).hide（）；
}, 300);
});
})

---

我建议您使用debounce

我是这样使用它的：

var debounce = _.debounce(search, 500, false);

$('#search-input').on('change', function() {
  debounce(this);
});

function search(input) {
  if(input.value.length > 2) {
    ...
  }
}

将执行等待用户停止插入值的操作

第一个参数是等待用户停止插入值后要调用的函数

第二个参数是它等待下一个值插入的时间（毫秒）

---

第三个参数是配置选项，使用false将使其发送最后插入的值。

使用

change

事件而不是

keyup

@Azim

change

是一个危险的参数，一些浏览器/平台只会在元素失去焦点后触发它，这通常不是您在搜索功能中想要的。

keyup

和

change

不会通过鼠标粘贴文本，因此他应该使用

input

事件。@Hiroo17我的示例不适合您？控制台错误？您的示例运行良好，但我在代码中实现它的那一刻它就不起作用了。我必须在某个地方安装fckd。无论如何，您的代码应该可以工作，所以我将其标记为解决方案。