您的位置:首页 > Web前端 > JQuery

jquery根据名称实时搜索匹配功能

2016-12-05 16:39 393 查看
jquery根据名称实时搜索匹配功能,可以根据输入信息快速定位到某个标签

<script>
(function ($) {
jQuery.expr[':'].Contains = function(a,i,m){
return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
function filterList(header, list) {
$("#search_input").change( function () {
var filter = $(this).val();
if(filter) {
$matches = $(list).find('a:Contains(' + filter + ')').parent();
$('dd', list).not($matches).slideUp();
$matches.slideDown();
} else {
$(list).find("dd").slideDown();
}
return false;
})
.keyup( function () {
$(this).change();
});
}
$(function () {
filterList($("#form"), $("#list"));
});
}(jQuery));
</script>
<div><div id="form"><input style="border-radius:0; font-size:14px; height:40px;line-height:40px;width: 95%;margin: 10px 1%;border: 1px solid #66afe9;padding-left: 3%;" placeholder="输入名称可快速查找" type="text" id="search_input"></div></div>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery