调整 jQuery 搜索表

Question

我有一个表格搜索功能，我想调整它以仅在标题列中查找匹配项。并隐藏所有与标题文本不匹配的项目。我的代码

JS

var $rows = $('#table tbody tr');
$('#search').keyup(function () {
    var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

    $rows.show().filter(function () {
        var text = $(this).text().replace(/\s+/g, ' ').toLowerCase();
        return !~text.indexOf(val);
    }).hide();
});

HTML

         <table id="table" class="table table-striped table-hover">
            <thead>
                <tr>
                    <th>Handlingar</th>
                    <th>Title</th>  <-----This column----
                    <th>Pris i kr</th>
                    <th>Skapad</th>
                    <th>Kategori</th>
                </tr>
            </thead>
            <tbody>
                @foreach (BuyAndSellAppWeb.Models.Advertisment objProduct in Model)
                {
                    <tr>
                        @if (objProduct.SellerToken)
                        {
                            <td>

                                @Html.ActionLink("Ändra", "Edit", new { id = objProduct.ID }) | @Html.ActionLink("Radera", "DeleteItem", new { id = objProduct.ID }) | @Html.ActionLink("Detaljer", "Details", new { id = objProduct.ID })

                        </td>
                        }
                        else
                        {
                            <td>
                                @Html.ActionLink("Detaljer", "Details", new { id = objProduct.ID })
                            </td>
                        }
                        <td>@objProduct.ProductTitle</td>
                        <td>@objProduct.Price kr</td>
                        <td>@objProduct.Created.ToString("yyyy/MMM/dd")</td>
                        <td id="category">@objProduct.Category</td>
                    </tr>
                }
            </tbody>
        </table>

尝试了很多不同的组合，但都没有奏效。

Answer 1

在你的 js 中试试这个。希望有效

$(document).ready(function() {
      var $rows = $('#table tbody tr');
      $('#search').keyup(function () {
          var val = $.trim($(this).val()).replace(/ +/g, ' ').toLowerCase();

          $rows.show().filter(function () {
              var text = $($(this).find('td')[1]).text().replace(/\s+/g, ' ').toLowerCase();
              return !~text.indexOf(val);
          }).hide();
      });
});