Javascript 如何按任何匹配的代码/名称而不是每个可用字段筛选表

我尝试做以下工作：我有一个表，其中填充了来自数据库的数据。除此之外，我还有一个输入，您可以在其中写入内容，还有一个按钮将进行过滤，只显示包含该字符串的行。这是工作了

问题是，输入应该只允许您按

foo.name/foo.code

（我实体的两个属性）进行过滤

我正在添加我的代码，以防有人能指导我，我尝试了几种方法，但这是我第一次体验JQuery，因为我有一个严格的故事交付时间。谢谢大家

${foo.name}
${foo.code}
${foo.country}
${foo.region}
${foo.subsection}
$（“#搜索”）。单击（函数（）{->按钮id
var value=$（“#foorRegionSearch”）.val（）；->输入的值
变量行=$（“#fooRegionTable”）.find（“tr”）->表id
rows.hide（）；
rows.filter（“：contains（“+value+”）”）”）.show（）；
});

首先，您的HTML无效-HTML中不能有ID重复的元素集。使用类而不是ID

然后，您需要确定哪些TR通过了测试

.filter

可以接受回调，因此向其传递一个函数，该函数在给定TR的情况下，使用jQuery选择器选择其

fooName

和

fooCode

子项，这些子项包含

值

：

$（“#搜索”）。单击（函数（）{
var值=$（“#foorRegionSearch”）.val（）；
变量行=$（“#fooRegionTable”）.find（“tr”）；
rows.hide（）；
行。过滤器(
（389;，row）=>$（row）.find（'.foonName，.fooCode'）.filter（`:contains（'${value}'））`）.length
).show（）；
});

名称1
代码1
${foo.country}
${foo.region}
${foo.subsection}
姓名2
代码2
${foo.country}
${foo.region}
${foo.subsection}
单击
开始，您的HTML无效-HTML中不能有ID重复的元素集。使用类而不是ID

然后，您需要确定哪些TR通过了测试
.filter
可以接受回调，因此向其传递一个函数，该函数在给定TR的情况下，使用jQuery选择器选择其
fooName
和
fooCode
子项，这些子项包含
值
：
$（“#搜索”）。单击（函数（）{
var值=$（“#foorRegionSearch”）.val（）；
变量行=$（“#fooRegionTable”）.find（“tr”）；
rows.hide（）；
行。过滤器(
（389;，row）=>$（row）.find（'.foonName，.fooCode'）.filter（`:contains（'${value}'））`）.length
).show（）；
});

名称1
代码1
${foo.country}
${foo.region}
${foo.subsection}
姓名2
代码2
${foo.country}
${foo.region}
${foo.subsection}
单击
Hi，谢谢您的回答。你能澄清一下双重身份证在哪里吗？虽然它必须是一个复制粘贴错误，因为在我的代码，它的工作预期。除此之外，我实际上把第一个解决方案。。。我已在所需行中添加了一个类。现在，我的jquery看起来就像我第一次发布的一样，但是过滤器是这样的：rows.filter（“#fooName:contains（“+value+”），#fooCode:contains（“+value+”））”））。show（）；它只隐藏行，但不显示行。。。有什么想法吗？谢谢您有一个
c:forEach
：您正在创建多个
tr
s，对吗？该表不仅仅由一个TR组成。因此，原始代码中呈现的HTML将包含大量重复ID。哦，我看到了问题，您正在过滤TR，但您需要深入到各个TDs，以确定哪些TDs通过了测试。
过滤器（'.fooName
等将不起作用，因为正在筛选的TR不是一个
。fooName
-TR是一个父级。请参见编辑。我接受了答案，但测试后它似乎不适用于IE，知道为什么吗？IE是最糟糕的。通常，如果您有一个需要与IE兼容的大脚本，最好的解决方案是使用Babel进行传输自动下载到ES5。您也可以手动将所有ES2015+语法替换为ES5语法，但对于任何不太小的东西来说，这都是非常繁琐和浪费时间的。您好，感谢您的回答。您能澄清一下双ID在哪里吗？虽然它一定是复制粘贴错误，就像我的代码中一样，它工作正常。除此之外帽子，我实际上是在绑定第一个解决方案…我已经在所需行中添加了一个类。现在我的jquery看起来像我第一次发布的，但是过滤器是这样的：rows.filter（“#foonName:contains（“+value+”），#fooCode:contains（“+value+”））。show（）；它只隐藏行，但不显示行…知道吗？谢谢！您有一个
c:forEach
：您正在创建多个
tr
s，对吗？该表不仅仅由一个tr组成。因此，原始代码中呈现的HTML将包含大量重复ID。哦，我明白了问题，您正在筛选tr，但您需要开始做wn到各个TDs，以确定哪些TDs通过了测试。
过滤器（'.fooName
等将不起作用，因为正在筛选的TR不是一个
。fooName
-TR是一个父级。请参见编辑。我接受了答案，但测试后它似乎不适用于IE，知道为什么吗？IE是最糟糕的。通常，如果您有一个需要与IE兼容的大脚本，最好的解决方案是使用Babel进行传输您也可以通过将所有ES2015+语法替换为ES5语法来手动执行，但这对于任何不太小的东西来说都是非常繁琐和浪费时间的