jQuery $.grep()模糊搜索方法是使用详解

客户要求我爱模板网做一个模糊搜索，数据是用ajax读取的，搜索结果显示在列表中。php的模糊搜索我知道，像这种已经得到结果，在结果中再进行模糊搜索，用js可能是个不错的选择。刚好隐约记得jQuery提供了类似的功能，即$.grep()模糊搜索方法。就用这个方法，顺便就当温习下：

定义：
    $.grep() 函数使用指定的函数过滤数组中的元素，并返回过滤后的数组。源数组不会受到影响，过滤结果返回在新数组中。

语法：

$.grep( array, function [, invert ] )

参数说明：

参数	描述
array	Array类型 将被过滤的数组。
function	Function类型 指定的过滤函数。grep()方法为function提供了两个参数：其一为当前迭代的数组元素，其二是当前迭代元素在数组中的索引。
invert	可选。 Boolean类型 默认值为false，指定是否反转(即将选中的不要，返回没有选中的)过滤结果。如果参数invert为true，则结果数组将包含function返回false的所有元素。

下面是我爱模板网写的一个案例：

<input type="text" /><button>搜索</button>
<ul></ul>

<script src="http://www.5imoban.net/tpl/js/jquery-1.8.3.min.js"></script>
<script>
$("button").click(function(){
    var searchKey = $(":text").val();
    var listData = ["PHP跳转页面的几种实现方法详解","使用PHP集成万网域名查询API接口","wampserver 的Apache启动错误提示","php免杀一句话","php set_time_limit 设置程序执行时间的函数","省市县三级联动SQL数据库文件下载","phpnow的php.ini文件在哪,phpnow php.ini在什么位置","phpcms文章标题字数限制修改方法","php上传文件大小的限制修改php.ini","phpMyAdmin 无法在发生错误时创建会话"];
    var filterArr = $.grep(listData,function(value,index){
        if(value.indexOf(searchKey)>=0){
            return value; //筛选出大于5的
        }
    })
    var _html = "";
    for(var i in filterArr){
        _html += "<li>"+filterArr[i]+"</li>"
    }
    if(_html=='')_html='<p>没有搜索到结果！请尝试搜索php、文件等词</p>';
    $("ul").html(_html);
})
</script>