利用jquery快速实现查询效果

最新推荐文章于 2024-07-14 12:56:18 发布

AngryXD

最新推荐文章于 2024-07-14 12:56:18 发布

阅读量3.3k

点赞数

分类专栏：实用技巧文章标签： javascript jquery html

本文链接：https://blog.csdn.net/AngryXD/article/details/78958172

版权

使用jquery快速实现搜索功能

摘要由CSDN通过智能技术生成

先上代码：

$(".findwrap button").off().click(function(){//选择按钮并绑定时间，使用off()确认绑定单一事件，属于较好编码习惯
			     var _val = $(".findwrap input").val();//获取关键词作为索引
				 if(_val==""){
				    $(".content-tab td").parent().show();//当关键词为空时，显示所有元素
				 } else{
				 	$(".content-tab td").parent().hide();//根据关键词决定显示的内容
				 	$(".content-tab td:contains("+_val+")").parent().show()
				 }
			})

大致效果如图:

以下是详述：

jquery是一个总能给你惊喜的工具库，多使用总是能发现更多简便之处

以上功能实现核心之出就在于使用了:contains(text)选择器，</