Foundation 6 Top Bar 下拉菜单不起作用

Jon*_*n_B 3 zurb-foundation

我直接从他们的网站https://foundation.zurb.com/sites/docs/top-bar.html复制了基础导航栏语法,下拉菜单功能似乎不起作用

这是代码:

<div class="top-bar">
  <div class="top-bar-left">
    <ul class="dropdown menu" data-dropdown-menu>
      <li class="menu-text">Site Title</li>
      <li>
        <a href="#">One</a>
        <ul class="menu vertical">
          <li><a href="#">One</a></li>
          <li><a href="#">Two</a></li>
          <li><a href="#">Three</a></li>
        </ul>
      </li>
      <li><a href="#">Two</a></li>
      <li><a href="#">Three</a></li>
    </ul>
  </div>
  <div class="top-bar-right">
    <ul class="menu">
      <li><input type="search" placeholder="Search"></li>
      <li><button type="button" class="button">Search</button></li>
    </ul>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

这是它的样子 在此处输入图片说明

小智 5

确保初始化基础:

$(document).foundation();
Run Code Online (Sandbox Code Playgroud)