使用 jQuery 获取另一个元素

Question

我构建了多级菜单，我的 HTML 结构如下所示：

<ul>
 <li>item 1</li>
 <li>item 2</li>
 <li>
   <ul> #this is set up as display: none;
     <li>subitem 1</li>
     <li>subitem 2</li>
     <li>subitem 3</li>
   </ul>
 </li>
 <li>item 3</li>
 <li>item 4</li>
</ul>

我正在解决一个问题，如何在item1上移动光标后显示所有子项。 我可以这样做：

   $('ul li ul').mouseover(function() {
      $(this).find('li').show();
   });

但这对我不起作用...谁能帮助我，请，如何为鼠标悬停事件显示 sub-ul 项目块？

谢谢

编辑：感谢你们的回复，感谢你们的帮助，我已经发现了我的愚蠢错误。

Answer 1

将其附加到父 LI，否则不会显示任何元素供 mouseover 触发。

还要注意，如果您在包含UL 的LI 中只有UL with the non-displayed LI's，那么mouseover 也可能很难做到。

$('ul li ul').parent().mouseover(function() {
    $(this).find('li').show();
});

http://jsfiddle.net/kSq4T/1/

Answer 2

您总是可以为您的项目元素添加一个类并执行以下操作：

       <ul>
 <li class="item">item 1</li>
 <li class="item">item 2</li>
 <li>
   <ul> #this is set up as display: none;
     <li>subitem 1</li>
     <li>subitem 2</li>
     <li>subitem 3</li>
   </ul>
 </li>
 <li>item 3</li>
 <li>item 4</li>
</ul>

$('#item').mouseover(function()
      $(this).children.show();