Question

我想在菜单元素中单击子按钮时显示子菜单。但是我在其他菜单元素上也有相同的html和类。因此，当我按下按钮时，它会打开所有子菜单并关闭打开的子菜单。

我希望它能够正常工作，这样当我点击一个按钮时，只有他的父母子菜单才能打开，如果点击则会关闭。

<ul>
  <li class="menu-item current-menu-item">
    <a href="">Menu1</a>
    <button>click</button>
       <ul class="submenu">
        <li>asdasd</li>
      </ul>
  </li>
  <li class="menu-item">
    <a href="">Menu2</a>
    <button>click</button>
       <ul class="submenu">
        <li>asdasd</li>
      </ul>
  </li>
    <li class="menu-item">
    <a href="">Menu3</a>
    <button>click</button>
      <ul class="submenu">
        <li>asdasd</li>
      </ul>
  </li>
</ul>

.submenu {
  display: none;
}
.current-menu-item .submenu {
  display: block;
}

$(".menu-item button").click(function(){
  $(".menu-item button").parent('.menu-item').toggleClass("current-menu-item");
});

http://codepen.io/rKaiser/pen/QKgQVQ

谢谢。

Answer 1

$(".menu-item button").click(function(){
  $(this).parent('.menu-item').toggleClass("current-menu-item");
});

否则jQuery选择器会找到具有类.menu-item按钮

的所有元素

Jquery只针对点击类而不是其他人？

1 个答案: