使用（this）没有锚标记

Question

目前有一个结构为：

的超级菜单

<ul>
  <li>
    <a class="level-top">Link 1</a>
    <ul class="subnav">Subnav</ul>
  </li>
  <li>
    <a class="level-top">Link 2</a>
    <ul class="subnav">
      <li>
        <a>Link 1 Level 2</a>
        <ul class="sub-subnav"></ul>
      </li>
    </ul>
  </li>
</ul>

当选择链接1时，我想要显示ul.subnav。目前使用的代码是：

jQuery('.mobile-nav li a.level-top').click(function () {
  togglePanel(jQuery(this).find('ul.subnav'));
});

如果从上面的jquery代码中删除 a.level-top ，则第一级（subnav）会正确打开。但是因为我要将click事件附加到li元素，所以当元素嵌套在li元素中时，我无法在导航中更深入地切换。

我需要将click函数附加到锚标记（a.level-top），但（this）将无法找到要打开的正确子菜单。

使用这个 - 锚标记的任何方式？

由于

Answer 1

使用.next()，而不是.find()：

jQuery('.mobile-nav li a.level-top').click(function () {
  togglePanel(jQuery(this).next('ul.subnav'));
});

原因是，ul.subnav是<a>的兄弟，而不是<a>的孩子。 .find()用于获取孩子。