gpt4 book ai didi

javascript - 使用文本框动态过滤表格

转载 作者:行者123 更新时间:2023-12-01 02:53:02 31 4
gpt4 key购买 nike

目前,我尝试仅向用户显示行包含用户搜索的内容的行。一个例子是,如果用户搜索便便,他们将显示包含便便的所有行。然而,由于某种原因,我的搜索仅从该行的最后一列获取信息,而不是整行。

$("#searchInput").keyup(function() {
var val = $(this).val();

$("#searchTable tr td").each(function(i) {
var content = $(this).html();
if (content.toLowerCase().indexOf(val) == -1) {
$(this).parent().hide();
} else {
$(this).parent().show();
}
});
});
<div>
<input type="text" id="searchInput" />
<table id="searchTable">
<tr>
<td>test</td>
</tr>
<tr>
<td>Latest</td>
</tr>
<tr>
<td>Mest</td>
</tr>
<tr>
<td>test</td>
</tr>
<tr>
<td>Best</td>
<td>chest</td>
</tr>
<tr>
<td>chest</td>
<td>poop</td>
</tr>
<tr>
<td>test</td>
<td>poop</td>
</tr>
<tr>
<td>Waste</td>
<td>poop</td>
</tr>
<tr>
<td>Test</td>
<td>poop</td>
</tr>
</table>


</div>

最佳答案

现在可以了。仅查看“tr”元素,而不查看“td tr”元素

JS Fiddle

js

$("#searchInput").keyup(function() {
var val = $(this).val();

$("#searchTable tr").each(function(i) {
var content = $(this).html();
if (content.toLowerCase().indexOf(val.toLowerCase()) == -1) {
$(this).hide();
} else {
$(this).show();
}
});
});

关于javascript - 使用文本框动态过滤表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46854382/

31 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com