为什么下拉菜单不起作用

时间:2015-01-18 23:53:23

标签: javascript html css twitter-bootstrap twitter-bootstrap-3

我想知道为什么下拉菜单不起作用。当我点击下拉菜单时,它不会出现。我正在使用bootstrap。请告诉我它为什么不起作用。

<li id="megamenuID" class="dropdown">
  <a class="dropdown-toggle" data-toggle="dropdown" href="#">
    Categories
    <b class="caret"></b>
  </a>
  <ul class="dropdown-menu" role="menu">
    <li>
      <div >
        <div class="row">
          <div class="col-xs-6 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
          <div class="col-xs-6 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
          <div class="col-xs-6 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
          <div class="col-xs-4 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
          <div class="col-xs-6 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
          <div class="col-xs-6 col-sm-2">
            <a class="thumbnail" href="#">
              <img alt="150x190" src="http://placekitten.com/150/190/">
            </a>
          </div>
        </div>
      </div>
    </li>
  </ul>
</li>

1 个答案:

答案 0 :(得分:0)

您是否在标题中包含了bootstrap.js脚本文件?它不起作用的主要原因是你要么没有包含它,要么输入错误的东西。

您能告诉我们您包含哪些脚本吗?

另外,请运行 Mozilla 页面(如果可能),打开控制台并在此处发布屏幕截图。我们将能够查看是否存在任何javascript问题。

编辑:(根据OP第一条评论)

据我所知,您已添加<script src="Scripts/jquery-1.9.1.js"></script>,但未包含bootstrap.js文件。

包括它:<script src="Scripts/bootstrap.js"></script>它应该正常工作。 (当然,如果bootstrap.js位于Scripts文件夹中。如果它位于另一个文件夹中,请正确更改路径。)

如果再次无效,请仅从 Mozilla控制台进行屏幕截图,并向我们展示正在进行的操作。

编辑2 :(根据OP第一条评论)

另外,请删除以下两个中的一个:

  • <link href="Content/bootstrap.min.css" rel="stylesheet" />
  • <link href="Content/bootstrap.css" rel="stylesheet" />

您要么使用缩小的bootstrap.min.css,要使用大css个文件,最好使用min版本,这样就不会产生大量的流量,或者您会使用non-minified版本,即bootstrap.css