JS-单击另一个按钮并在单击时关闭菜单

Question

我正在 Foundation 6 中构建一个菜单，由于缺乏更好的解决方案，我试图让脚本在单击菜单项后单击 Moue 按钮。

<div data-sticky-container>
  <div class="small-12 sticky" data-sticky data-options="stickyOn: small" data-margin-top="0">

    <div class="title-bar" data-responsive-toggle="responsive-topbar" data-hide-for="medium">
      <a href="#" class="menu-text show-for-small-only">BB</a>
      <button class="menu-icon float-right" type="button" data-toggle></button>
    </div>

    <div class="top-bar" id="responsive-topbar">
      <div class="top-bar-left">
        <ul class="menu">
          <li class="menu-text hide-for-small-only">AA</li>
        </ul>
      </div>
      <div class="top-bar-right">
        <ul class="dropdown menu" data-dropdown-menu>
          <li><a href="#" class="clicked">One</a></li>
          <li><a href="#" class="clicked">Two</a></li>
          <li><a href="#" class="clicked">Three</a></li>
        </ul>
      </div>
    </div>
  </div>
</div>

<script>

 $('.clicked').click(function(evt) {
    $('.menu-icon').click();
});

</script>

这个脚本针对的是正确的元素吗？

<script>

     $('.clicked').click(function(evt) {
        $('.menu-icon').click();
    });

    </script>

关于如何解决这个问题有什么建议吗？

Answer 1

此代码会将 .top-bar 元素设置为 display: none;

$('.dropdown li a').click(function() {
 $('.top-bar').css('display', 'none');
});

JS-单击另一个按钮并在单击时关闭菜单

JS- to click another button and close a menu on click

jquery

menu

zurb-foundation