单击时，按类名查找下一个元素

Question

我有一个移动菜单，当用户单击“open”类的 span 时，下一个 footer-menu-accordion 将打开。但是，当用户单击锚链接“level-1”Men 时，它也会打开。 我现在要做的是，当用户单击 Men I would like to use jquery 查找 NEXT footer-menu-accordion 并将其保持为 display:none （这是包含 level-2 锚标记的父 div ）。我知道我必须使用 jquery 的 next() 或 find() 方法，但我不知道该怎么做。谁能帮帮我？

function mobileMainNav() {
  $('a.level-1.direct').click(function(e) {
    window.location = $(this).attr('href');
  });
}

mobileMainNav();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mobile-menu" class=" footer-menu-accordion ">
  <div class="dropdown-container ">
     <a class="level-1 direct">Men</a>
     <span class="open">img</span>
  </div>
  <div class="footer-menu-accordion ">
    <a class="level-2 "></a>
    <ul></ul>
    <a class="level-2 "></a>
    <ul></ul>
    <a class="level-2 "></a>
    <ul></ul>
  </div>
</div>

我写了这个，所以当我点击 1 级时，我会被定向到我网站的“男士”部分。这很好用，但是当我单击 level-1 时，我不希望打开下一个下拉菜单，而它目前确实如此。所以我知道我需要在这个函数中添加更多的 jquery 来做到这一点，我只是不确定我是 jQuery 的新手。先感谢您！

Answer 1

我不确定你是否想为你的锚标记获取最近的页脚，级别为 1 ......如果是这样，试试这个：

function mobileMainNav() {
  $('a.level-1').click(function(e) {
    var nearestFooter = $(this).parent().siblings('div.footer-menu-accordion');
    console.log(nearestFooter[0]);
  });
}

mobileMainNav();

<div id="mobile-menu" class="footer-menu-accordion">
  <div class="dropdown-container">
     <a class="level-1">Men</a>
     <span class="open">img</span>
  </div>
  <div class="footer-menu-accordion">
    <a class="level-2"></a>
    <ul></ul>
    <a class="level-2"></a>
    <ul></ul>
    <a class="level-2"></a>
    <ul></ul>
  </div>
  </div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

你也没有类（.direct）的元素