目前,我尝试仅向用户显示行,如果该行包含用户搜索的内容。这样的一个例子是,如果用户搜索poop,他们将显示包含poop的所有行。但是出于某种原因,我的搜索仅从行的最后一列获取信息而不是整行。
$("#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>
答案 0 :(得分:2)
现在它有效。只查看“tr”元素而不是“td tr”元素
<强> 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();
}
});
});