javascript - 单击时无法激活导航栏中的 Bootstrap 下拉菜单

Question

我正在尝试使用 Bootstrap 导航下拉菜单创建网站的模型。我对此仍然很陌生，我已经阅读了有关此内容的帖子并尝试了各种编辑，但是当我单击它时，我的下拉菜单仍然没有激活。任何建议或指示将不胜感激。谢谢!

链接到我的jsfiddle:https://jsfiddle.net/allisoncodes/sdywsaf4/10/

HTML:

<div class="dropdown">

  <button class="btn btn-default">
    <a href="#home">
      <icon class="fa fa-home"></icon>
    </a>
  </button>
  <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown">Community
    <span class="caret"></span></button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" href="#" data-toggle="tab">Recent Activity</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" href="#" data-toggle="tab">Member Forum</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" href="#" data-toggle="tab">Member List</a></li>
    <li role="presentation" class="divider"></li>
    <li role="presentation"><a role="menuitem" href="#" data-toggle="tab">Member Groups</a></li>
  </ul>
  <button class="btn btn-default">
    <a href="#">Pet Help</a></button>
  <button class="btn btn-default"><a href="#">Pets For Sale</a></button>
  <button class="btn btn-default"><a href="#">Pets Services</a></button>
  <div class="content">

  </div>
</div>

jQuery:

$('[data-toggle=tab]').hover(function (e) {
  $(this).click();
});

Answer 1

事实证明我的代码是正确的，我只是忘记包含 jQuery CDN。感谢您的帮助!