Question

我有一个顶部栏，其中包含一个下拉菜单，其中包含当前用户帐户的链接（例如仪表板，退出等）。每个菜单项都包含一个指向相对URL的链接。

打开菜单工作正常，但只要我点击一个项目，菜单就会关闭，没有任何反应。

我已经找到了click和mousedown事件处理程序，但找不到任何看起来会导致这种情况的东西。

有人对此有什么想法吗？

以下是相关的HTML代码：

<div class="contain-to-grid nav-wrapper">
   <nav data-topbar="data-topbar" role="navigation" class="top-bar">
      <ul class="title-area">
         <li class="name">
            <h1><a href="/">Site name</a></h1>
         </li>
      </ul>
      <section data-hook="user-info" class="top-bar-section">
         <ul class="right">
            <li class="has-dropdown">
               <a href="#" data-hook="account-menu" class="external-link">username</a>
               <ul class="dropdown">
                  <li><a href="/app/dashboard">Dashboard</a></li>
                  <li><a href="/auth/logout" class="external-link">Sign out</a></li>
               </ul>
            </li>
         </ul>
      </section>
      <section class="top-bar-section">
         <ul class="right">
            <li><a href="/features">Link 1</a></li>
            <li><a href="/pricing">Link 2</a></li>
            <li><a href="/support">Link 3</a></li>
         </ul>
      </section>
   </nav>
</div>

它的小提琴：https://jsfiddle.net/a3qrhg5a/

Answer 1

您可能忘记包含 jQuery 并初始化 Foundation JS

例如：

    <script src="js/vendor/jquery.js"></script>
    <script src="js/foundation/foundation.js"></script>

    <script>
      $(document).foundation();
    </script>

这是你的小提琴。固定： https://jsfiddle.net/bartholomej/nxgjqtw4/5/

顶部栏中的下拉菜单在发射链接之前在mousedown关闭

1 个答案: