如何实现对表格数据内容的快速筛选和查找呢？
jquery中的filter和contains共同使用可以快速实现了这个功能。
如下html代码：

<div class="wrapper" style="width:300px;margin:50px auto">
        <label>筛选</label>
        <input type="text" id="searchbox" style="width:257px"/>
        <div class="margin" style="margin-top:10px;"></div>
        <table border="1" cellspacing="0">
            <thead>
                <tr><td>姓名</td><td>性别</td><td>暂住地</td></tr>
            </thead>
            <tbody>
                <tr><td>张山</td><td>男</td><td>湖北</td></tr>
                <tr><td>abd</td><td>女</td><td>湖南</td></tr>
                <tr><td>王麻子</td><td>男</td><td>河北</td></tr>
                <tr><td>李四</td><td>男</td><td>河南</td></tr>
                <tr><td>王五11</td><td>女</td><td>江苏</td></tr>
                <tr><td>赵六d</td><td>男</td><td>江西</td></tr>
            </tbody>
        </table>
    </div>

可以实现如下简单的搜索框和表格界面：

表格和搜索框.png

需要实现在搜索框中输入内容，然后对表格内容筛选删除搜索框内容时，所有表格数据还原显示。jquery代码如下：

<script>
        $(function () {
            $("#searchbox").keyup(function () {
                $("table tbody tr").hide()
                .filter(":contains('"+($(this).val())+"')").show();//filter和contains共同来实现了这个功能。
            }).keyup();
        });
    </script>

输入'男'.png