Question

我在1个单页的4个不同的表格中有运动草稿结果。我有一个搜索栏，用于搜索表格中的人物名称，过滤到只显示他们出现的行。现在它只搜索一个表格，而不是搜索另一个表格。我正在尝试让搜索在我的整个页面中的任何表格中普遍工作。如果你们中的任何一个人熟悉它我会使用tableaw。

HTML表格开始：

<input type="text" id="search" placeholder="Search for Player">
<table class="tablesaw" id="tablesaw" data-tablesaw-mode="swipe" data-tablesaw-minimap>
<thead>
<tr>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="persist">Round Value</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="2">1st</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="3">2nd</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="4">3rd</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="5">4th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="6">5th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="7">6th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="8">7th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="9">8th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="10">9th</th>
<th scope="col" data-tablesaw-sortable-col data-tablesaw-priority="11">10th</th>
</tr>
</thead>
<tbody>
<tr>
                <td class="title">Round 1</td>
                <td width="130"> Mike Trout</td>
                <td width="134"> Giancarlo Stanton</td>
                <td width="148"> Andrew McCutchen</td>
                <td width="151"> Paul Goldschmidt</td>
                <td width="128"> Clayton Kershaw</td>
                <td width="126">Jose   Abreu</td>
                <td width="122"> Adam Jones</td>
                <td width="142"> Anthony Rizzo</td>
                <td width="127"> Miguel Cabrera</td>
                <td width="137"> Yasiel Puig</td>
</tr>

我的剧本：

<script>
var $rows = $('#tablesaw 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();
});
</script>

Answer 1

您的CSS选择器匹配带有id tablesaw的元素中带有tr标签的元素：

var $rows = $('#tablesaw tr');

Ids是独一无二的;如果您为多个元素提供相同的ID，则除第一个之外的所有ID都无效。您的选择器只匹配第一个。如果要匹配多个表中的元素，则应使用类名而不是id，如下所示：

var $rows = $('.tablesaw tr');

确保所有表格都有class =＆＃34; tablesaw＆＃34;。

我希望有所帮助。

跨多个表搜索

1 个答案: