onkeyup事件不起作用的Javascript搜索栏

我在这里有一个搜索栏，我可以在这里搜索员工onkeyup事件。但是，当我尝试添加类和另一个td标记时，该函数不起作用。请看下面我的代码。任何帮助都将不胜感激。谢谢大家!

函数myFunction（）{
var输入、过滤器、表格、tr、td、i、TXT值；
输入=document.getElementById（“search2”）；
filter=input.value.toUpperCase（）；
table=document.getElementById（“myTable”）；
tr=table.getElementsByTagName（“tr”）；
对于（i=0；i-1）{
tr[i].style.display=“”；
}否则{
tr[i].style.display=“无”；
}
}
}
}

约翰·布莱恩·史密斯
灰色
JohnSMith@gmail.com

初级制作人/
活动
2114

更改了此行

td=tr[i].getElementsByTagName（“td”）[1]

使用索引

[1]

，因为您需要第二个

td

。索引

[0]

引用了第一个TD。我建议使用一些类选择器来获取正确的

td

，因为当表结构发生变化时，这样更可靠

您还可以在一个td中使用id（

id=“empname”

）。我假设您可以得到多行。如果是这样，您需要确保此id是唯一的。最好不要在动态内容中使用id，而是在类中使用id

函数myFunction（）{
var输入、过滤器、表格、tr、td、i、TXT值；
输入=document.getElementById（“search2”）；
filter=input.value.toUpperCase（）；
控制台日志（过滤器）；
table=document.getElementById（“myTable”）；
tr=table.getElementsByTagName（“tr”）；
对于（i=0；i-1）{
tr[i].style.display=“”；
}否则{
tr[i].style.display=“无”；
}
}
}
}

约翰·布莱恩·史密斯
灰色
JohnSMith@gmail.com

初级制作人/
活动
2114

这就是使用现代Javascript的方法。如果有什么不清楚的地方，请告诉我，这样我可以详细解释

旁注：每个

tr

都“知道”它是

td

s，并将它们存储在名为

单元格的
HTMLCollection
中


search2.addEventListener（'input'，（）=>{
myTable.querySelectorAll（'tr'）.forEach（行=>row.hidden=row.cells[1]。innerText.toUpperCase（）.indexOf（search2.value.toUpperCase（））=-1）
})

约翰·布莱恩·史密斯
灰色
JohnSMith@gmail.com

初级制作人/
活动
2114
杰克·布鲁斯
灰色
JackBruce@gmail.com

初级制作人/
活动
2114
这是因为您的函数只检查每行的第一个单元格您需要将其更改为其他单元格，因为第一个单元格包含图像。@Titus嗨，我可以知道如何操作吗？对不起，我只是一个javascript新手。非常感谢。如果要在第二个单元格中搜索匹配项，请使用
td=tr[i].getElementsByTagName（“td”）[1]@Titus嗨，试过了，但没有显示任何东西。当我键入列表时，列表不见了，没有显示任何内容。谢谢。您有一些无效的HTML
/em>
，请修复该问题，看看问题是否仍然存在。@x'tian您使用的是什么浏览器，什么浏览器不工作？我使用的是chrome搜索，搜索到的员工的显示不工作working@x“田，请再试一次，我做了一些修改，所以案例不再适用于匹配（因此，“jac”的输入也与“jac”匹配）。我已成功运行了您的代码。以前不工作的原因是我删除了另一个for
标记，现在它工作了，但问题是在搜索ex时页面的高度发生了变化。该搜索中只有一名员工页面变短了。您知道如何解决此问题吗？