Javascript 在表格中显示单元格名称属性包含输入字符串的行（JQuery）

我希望有一个keyup函数，它只显示与输入文本匹配的行，并按跨多行的单元格显示。 考虑下表：

  <table border='1'>
    <tr>
        <td rowspan='2'>Key1</td>
        <td name='Key1'> dummy1 </td>
    </tr>
     <tr>
        <td name='Key1'> dummy2 </td>
     </tr>
     <tr>
        <td rowspan='2'>Key2</td>
        <td name='Key2'> dummy3 </td>
    </tr>
     <tr>
        <td name='Key2'> dummy4 </td>
     </tr>
</table>

关键1
笨蛋
傻瓜2
键2
傻瓜3
傻瓜4

---

在这里，每行都有第二个td标记，其名称与其“父”列文本匹配。因此，当我在输入字段中键入“Key1”时，我希望它只显示dummy1和dummy2。在jquery中可以吗？

我知道您希望显示具有匹配的

名称的行。如果这是错误的，请详细说明，然后我可以更新它

下面是一个演示：

我知道您希望显示具有匹配的
名称的行。如果这是错误的，请详细说明，然后我可以更新它

下面是一个演示：

这里是我对你的问题的看法，假设你总是希望第一栏显示出来


关键1
笨蛋
傻瓜2
键2
傻瓜3
傻瓜4
.数据{
显示：无；
}
var theData=$（'td.data'）；
var input=$（'#myInput'）。在（'keyup'，function（）上{
theData.hide（）；
var value=input.val（）；
var matches=theData.filter（“[name=”+value+“]”）；
匹配。show（）；
});
假设您总是希望第一列显示，那么我将对您的问题发表以下看法


关键1
笨蛋
傻瓜2
键2
傻瓜3
傻瓜4
.数据{
显示：无；
}
var theData=$（'td.data'）；
var input=$（'#myInput'）。在（'keyup'，function（）上{
theData.hide（）；
var value=input.val（）；
var matches=theData.filter（“[name=”+value+“]”）；
匹配。show（）；
});
首先，我建议使用
来包装每个键，因为表应该用于数据结构（如果这就是它的用途，请原谅）

其次，只需在搜索框中附加一个on
keyup
事件，然后根据id查找匹配项。请参见下面的示例：


还值得一提的是，如果您最终拥有大量行，因此对于快速打字机只触发一个筛选器，那么将
超时
附加到
keyup
事件可能非常有用
 首先，我建议使用
来包装每个键，因为表应该用于数据结构（如果这就是它的用途，请原谅）

其次，只需在搜索框中附加一个on
keyup
事件，然后根据id查找匹配项。请参见下面的示例：


还值得一提的是，如果您最终拥有大量行，因此对于快速打字机只触发一个筛选器，那么将
超时
附加到
keyup
事件可能非常有用
 是的，这在jQuery中是可能的。请参阅
：contains（）
选择器。是的，它可以在jQuery中使用。请参阅
：contains（）
选择器。它是否不区分大小写？@griboedov请参阅上面的更新代码和示例：它是否不区分大小写？@griboedov请参阅上面的更新代码和示例：
$('input').keyup(function(){
   $('tr').hide();
   $("td").filter(function() {
      return $(this).text().toLowerCase().indexOf(keyword) != -1; }).parent().show().next().show();
   });
});

<input type="text" id="myInput" />

<table border='1'>
    <tr>
        <td rowspan='2'>Key1</td>
        <td name='Key1' class="data"> dummy1 </td>
    </tr>
     <tr>
        <td name='Key1' class="data"> dummy2 </td>
     </tr>
     <tr>
        <td rowspan='2'>Key2</td>
        <td name='Key2' class="data"> dummy3 </td>
    </tr>
     <tr>
        <td name='Key2' class="data"> dummy4 </td>
     </tr>
</table>

.data{
    display:none;
}

var theData = $('td.data');

var input = $('#myInput').on('keyup', function(){
    theData.hide();
    var value = input.val();

    var matches = theData.filter('[name="'+value+'"]');
    matches.show();
});