gpt4 book ai didi

javascript - 过滤动态创建的表行(Jquery)

转载 作者:行者123 更新时间:2023-11-28 02:28:51 29 4
gpt4 key购买 nike

我必须根据搜索栏内提供的输入过滤一个表(包含用户的名字、姓氏、电话和地址)。

表格的内容是使用表单通过 jquery 动态添加的。

下面的代码是我到目前为止能够做的关于过滤表行的代码(它只适用于在 html 中编码的表行,而不适用于使用 jquery 动态添加的表行)。

我知道可以在 .on() 函数上添加委托(delegate)事件处理程序,但我无法编写完成这项工作的代码。

//Code that filters table rows according to user's search bar content

$("#search").on("keyup", function() {
var value = $(this).val().toLowerCase();
$("#myTable tr").filter(function() {
$(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
});
});
<input type="text" id="search" placeholder="Search for names..">
<!-- This is my search bar -->

非常感谢,卢卡·P​​。

最佳答案

你可以使用这个函数

    $("#search").on("keyup", function() {
var input, filter, table, tr, td, i;
input = $("#search");
filter = input.val().toUpperCase();
table = $("#table");
tr = table.find("tr");

tr.each(function () {
var linha = $(this);
$(this).find('td').each(function () {
td = $(this);
if (td.html().toUpperCase().indexOf(filter) > -1) {
linha.show();
return false;
} else {
linha.hide();
}
})
})
})

关于javascript - 过滤动态创建的表行(Jquery),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52172230/

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