代码参考:
http://www.sharejs.com/codes/javascript/4289
http://www.jb51.net/article/103420.htm
https://www.zhihu.com/question/21652436/answer/18899099
1、无延迟版本
// 重写contains方法,使其筛选时忽略大小写,可以放在页面中,也可放在全局。 jQuery.expr[':'].contains = function (a, i, m) { return jQuery(a).text().toUpperCase() .indexOf(m[3].toUpperCase()) >= 0; }; $("#searchBox").keyup(function () { $("table tbody tr").stop().hide() //将tbody中的tr都隐藏 .filter(":contains('"+($(this).val())+"')").show(); //,将符合条件的筛选出来 });
本例执行效率很高,同样适用div表格,将&("table tbody tr")适当调整即可。
2、略延迟版本
var k, tFilter=function(value){// 表格内容筛选 // search code $("table tbody tr").stop().hide();// 将tbody中的tr都隐藏 //.filter(":contains('" + (value) + "')").show(); //将符合条件的筛选出来 $("table tbody tr").filter(":contains('" + (value) + "')").show(); }; document.getElementById('searchBox').οnkeydοwn=function(){// 输入触发 var self=this; clearTimeout(k); k=setTimeout(function(){ console.log(k); tFilter(self.value); },400); }; // 如需忽略大小写,可添加1中的contains方法。