javascript - jQuery 仅在过滤后导航可见项目

Question

我制作了一个简单的箭头键导航列表(使用 firedevs jquery keynav 插件)，可以在这里看到: https://output.jsbin.com/zowowo

编辑: https://jsbin.com/zowowo/edit?html,css,js

它现在可以正常工作，但在单击联系人组 1 或 2 菜单以使用 .toggle() 过滤列表后，它仍在导航已删除/隐藏的列表项。也尝试使用 .remove() 代替，但同样的问题仍然存在。我能让它工作的唯一方法是用不同的 html 完全刷新页面。

我只想在过滤后只能导航显示的项目，而删除的项目不应该是可导航的。一个想法是将其隐藏而不是删除，并在脚本中检查它是否可见，否则忽略它但我不确定如何实现这一点，因为我是前端新手。可能有多种方法可以实现结果。

如果有前端专家能提供一些帮助，我将不胜感激，谢谢!

Answer 1

伙计，这东西有问题吗。

因此，首先我在函数中创建了一个名为 eupdate(外部更新的缩写)的方法。

然后我编辑了您的点击事件以包括一些检查以查看当前选择在点击后是否可见，如果不可见，则将第一个可见元素设为当前元素。 我必须在方法中添加一个复位电流。

请查看此处的输出:

https://output.jsbin.com/zegirid

此处可编辑版本:

https://jsbin.com/zegirid/1/edit?html,css,js,console,output

我添加了一些符号来展示我所做的。