3

我已经从 SO 中的示例中设置了一个基本表,我其中添加了列标题。

任何人都可以提出如何修复表格过滤器的建议,使其不隐藏列标题吗?这是我一直在测试的jsfiddle代码。

Javascript

var $rows = $('#table tr');
$('#search').keyup(function() {

var val = '^(?=.*\\b' + $.trim($(this).val()).split(/\s+/).join('\\b)(?=.*\\b') + ').*$',
    reg = RegExp(val, 'i'),
    text;

$rows.show().filter(function() {
    text = $(this).text().replace(/\s+/g, ' ');
    return !reg.test(text);
}).hide();
});

示例搜索:如果您在搜索中键入 apple - 它会隐藏标题 1 和标题 2。但是,我更喜欢在输入搜索后保留标题 1 和标题 2。

4

2 回答 2

4

我的建议:在标题中添加一个类,并将其从过滤结果中排除:

http://jsfiddle.net/7BUmG/1161/

<input type="text" id="search" placeholder="Type to search">
<table id="table">
     <tr class="header">
      <th>Title 1</th>
      <th>Title 2</th>
    </tr>    
    <tr>
      <td>Apple</td>
      <td>Green</td>
   </tr>
   <tr>
      <td>Grapes</td>
      <td>Green</td>
   </tr>
   <tr>
      <td>Orange</td>
      <td>Orange</td>
   </tr>
</table>

    var $rows = $('#table tr[class!="header"]');
    $('#search').keyup(function() {

        var val = '^(?=.*\\b' + $.trim($(this).val()).split(/\s+/).join('\\b)(?=.*\\b') + ').*$',
            reg = RegExp(val, 'i'),
            text;

        $rows.show().filter(function() {
            text = $(this).text().replace(/\s+/g, ' ');
            return !reg.test(text);
        }).hide();
    });
于 2013-11-14T15:53:25.853 回答
2

利用var $rows = $('#table tbody tr');

于 2013-11-14T15:51:35.350 回答