javascript - 如何处理带有隐藏元素的 .next() 函数

Question

我正在制作一个带有箭头键功能的自定义下拉菜单，并被 :contains 过滤。 .

我似乎无法通过以下代码。发生的事情是我需要在当前悬停的 li 处开始选择，然后继续到下一个或上一个具有类 match 的 li。 .

我的以下代码正确启动，但即使它有 .next('.match')它不会通过 <li>要么没有类(match)要么是(隐藏的)

next()隐藏元素的函数中断？

J查询代码

 $('.dropdown_shell.opened li.match.hovered')
     .next('.match')
     .addClass('hovered')
     .siblings()
     .removeClass('hovered');

HTML

<ul class="scroll">
     <li class="selected default match">None</li>
     <li class="" style="display: none;">For Sale</li>
     <li class="match">For Rent</li>
     <li class="" style="display: none;">For Lease</li>
     <li class="match hovered">Sale or Lease</li>
     <li class="match">New Listing</li>
     <li class="match">Open House</li>
</ul>

Answer 1

您的 next() 函数没有按照您的预期运行。它查看下一个元素，仅匹配给定的选择器。否则它返回一个空的 jQuery 对象。

相反，您需要 nextAll() ，它查看所有 future 的 sibling ，然后使用 first() 方法(或 :first)选择器来匹配第一个。

你可以在这里看到这个工作； http://jsfiddle.net/DH3hG/

回答你关于 next() 是否考虑隐藏元素的问题； 是的是的。考虑插入到 DOM 中的任何内容。