我在一家交通机构工作,拥有大量数据(大部分是多次),我需要一种使用两个文本框(“收件人”和“发件人”)来过滤数据的方法。
我发现了 jQuery 快速搜索,但它似乎只适用于一个文本框。
如果有人通过 jQuery 或其他客户端库有任何想法,那就太棒了。
理想的例子:
收件人:[文本框] 发件人:[文本框]
<table>
<tr>
<td>69th street</td><td>5:00pm</td><td>5:06pm</td><td>5:10pm</td><td>5:20pm</td>
</tr>
<tr>
<td>Millbourne</td><td>5:09pm</td><td>5:15pm</td><td>5:20pm</td><td>5:25pm</td>
</tr>
<tr>
<td>Spring Garden</td><td>6:00pm</td><td>6:15pm</td><td>6:20pm</td><td>6:25pm</td>
</tr>
</table>
我有一个 HTML 页面,上面有一个巨大的表格,列出了车站名称和每个车站的时间。我希望能够将起始位置放在一个框中,将结束位置放在另一个框中,并使表中与输入的两个位置都不相关的所有项目消失,只留下与内容匹配的两行被输入(即使他们拼写不正确或完全输入)类似于 jQuery 快速搜索插件
最佳答案
如果您想构建自己的,那么这是一种可能的实现:
// store values for later
$('#table-to-fiter tr').each(function() {
var firstCellText = $('td:first', this).text().toLowerCase();
$(this).data('firstCellText', firstCellText);
});
function refreshFilter() {
var toValue = $('#to-input').val().toLowerCase(),
fromValue = $('#from-input').val().toLowerCase(),
firstCellText;
$('#table-to-fiter tr').each(function() {
firstCellText = $(this).data('firstCellText');
if (firstCellText.indexOf(toValue) !== -1 || firstCellText.indexOf(fromValue) !== -1) {
$(this).show();
} else {
$(this).hide();
}
});
}
$('#to-input, #from-input').keyup(refreshFilter);
关于jquery - 使用/jQuery 从 HTML 表中过滤大量数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2699439/