搜索框实现搜索一个保险商实验所列表中的指定关键词的李。

超文本标记语言代码：

ul class=' todo-content ' Li class=' todo-LTE ' div class=' todo-tip ' pfhasjfas/p/div class=' todo-BTN列表'按钮class=' BTN-finish '完成/button button class='btn-finish '修改/button button class='btn-finish '删除/button/div/Li Li class=' todo-LTE ' div class=' todo-tip ' pfhasjfas/p/div class=' todo-BTN列表' button class=' BTN-finish '完成/button button class='btn-finish '修改/button button class='btn-finish '删除/button/div Li class=' todo-ltem ' div class=' todo-tip ' p你好/p/div div class=' todo-BTN列表'按钮class=' BTN-完成'完成/button button class='btn-finish '修改/button button class='btn-finish '删除/button/div Li class=' todo-ltem ' div class=' todo-tip ' p你好啊/p/div div class=' todo-BTN列表'按钮class=' BTN-完成'完成/button button class='btn-finish '修改/button button class='btn-finish '删除/button /div /li /uljs:

当回车（键码为13)按下时，获取输入框(id为findinput)的值，并保存在关键字关键字中，利用过滤器()对里进行筛选。

将原有内容隐藏，筛选出的内容进行渐变显示。

$('#findinput ').向下键(函数(事件)){ if(事件)。键码==13){ var关键字=$(这个).val() //alert(关键字)$('li ').hide()//将原有的内容隐藏//然后将含有关键字的里进行渐变显示$('p ').筛选器(“:包含(”关键字')')。父母('。todo-LTE’).fadeIn(2000) } })效果如下：

未筛选时：

筛选后：

总结

以上所述是小编给大家介绍的框架实现搜索框功能实例详解，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！