过滤表以列方式记录

时间:2015-09-27 08:46:32

标签: javascript jquery

我有一个表格,我希望根据列值过滤行。



<input id="searchInput" value="Column 1 Filter">
<input id="searchInput2" value="Column 2 Filter">
<br/>
<table id="myTable">
    <thead>
        <tr>
            <th>Column1</th>
            <th>Column2</th>
        </tr>
    </thead>
    <tbody id="fbody">
        <tr>
            <td>cat</td>
            <td>one</td>
        </tr>
        <tr>
            <td>dog</td>
            <td>two</td>
        </tr>
        <tr>
            <td>cat</td>
            <td>three</td>
        </tr>
        <tr>
            <td>moose</td>
            <td>four</td>
        </tr>
    </tbody>
</table>
&#13;
&#13;
&#13;

我正在使用jquery的过滤方法:

$("#searchInput").keyup(function () { // or searchInput2
    //split the current value of searchInput
    var data = this.value.split(" ");
    //create a jquery object of the rows
    var jo = $("#fbody").find("tr");
    if (this.value == "") {
        jo.show();
        return;
    }
    //hide all the rows
    jo.hide();

    //Recusively filter the jquery object to get results.
    jo.filter(function (i, v) {
 // only filter on the basis of first column
        var $t = $("#myTable tr td:first-child")
        for (var d = 0; d < data.length; ++d) {
            if ($t.is(":contains('" + data[d] + "')")) {
                return true;
            }
        }
        return false;
    })
    //show the rows that match.
    .show();
})
.......
............

但它不起作用。此外,我不想使用任何插件,如数据表。

0 个答案:

没有答案