javascript - Jquery在表内搜索

Question

嗨，我需要在表中使用 jquery 进行搜索。但问题是我的代码仅搜索所有行的第一个元素，而不是搜索整个表并显示结果。如何搜索整个表格？

这是我的 jquery 代码

$("#search").on("keyup", function() {
    var value = $(this).val();

    $(".table tr").each(function(index) {
        if (index !== 0) {

            $row = $(this);

                var id = $row.find("td").text();

            if (id.indexOf(value) !== 0) {
                $row.hide();
                </td>');
            }
            else {
                $row.show();

            }
        }


    });
});

这是我的 html 表:

<input type="text" class="form-control" name="search" id="search" placeholder="Search Records">
<table class="table table-bordered table-striped" id="employees">
                        <thead>
                        <tr>
                            <th>No</th>
                            <th>Type</th>
                            <th>Name</th>
                            <th>Temp Address</th>
                            <th>Permanent Address</th>
                            <th>Mobile</th>
                            <th>Home</th>
                            <th>Update</th>
                        </tr>
                        </thead>
                        <tbody><tr>

                <td>27006</td>
                <td>Fixer</td>
                <td>Sam</td>
                <td>testing address</td>
                <td></td>
                <td>123456</td>
                <td>123456</td>
            </tr>
            </tbody>
            <tbody><tr>

                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
            </tr>
            </tbody>
            </table>

Answer 1

试试这个 -

 $("#search").keyup(function(){
        _this = this;
        $.each($("#employees tbody tr"), function() {        
        if($(this).text().toLowerCase().indexOf($(_this).val().toLowerCase()) === -1)
               $(this).hide();
            else
               $(this).show();                
        });
    }); 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="form-control" name="search" id="search" placeholder="Search Records">
<table class="table table-bordered table-striped" id="employees">
                     <thead>
                        <tr>
                            <th>No</th>
                            <th>Type</th>
                            <th>Name</th>
                            <th>Temp Address</th>
                            <th>Permanent Address</th>
                            <th>Mobile</th>
                            <th>Home</th>
                            <th>Update</th>
                        </tr>
                      </thead>
                      <tbody>
                      <tr>
                        <td>27006</td>
                        <td>Fixer</td>
                        <td>Sam</td>
                        <td>testing address</td>
                        <td></td>
                        <td>123456</td>
                        <td>123456</td>
                      </tr>
                </tbody>
            <tbody><tr>

                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
                <td>test</td>
            </tr>
            </tbody>
            </table>

谢谢