Bootstrap中的Dropdown Navbar无法正常工作

时间:2014-07-24 07:44:54

标签: javascript html css twitter-bootstrap

调整导航栏大小时,下拉列表似乎不起作用。 我的代码有什么问题吗? 对此有什么解决方案吗?

这是我的HTML代码。

<!-- Fixed navbar -->
<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="home.php">company</a>
    </div>
    <div class="navbar-collapse collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="home.php"><i class="glyphicon glyphicon-home"></i><span>&nbsp;Home</span></a></li>
        <li><a href="order.php"><i class="glyphicon glyphicon-pencil"></i><span>&nbsp;Order</span></a></li>
        <li><a href="cart.php"><i class="glyphicon glyphicon-shopping-cart"></i><span>&nbsp;Cart</span></a></li>
        <li><a href="contactus.php"><i class="glyphicon glyphicon-earphone"></i><span>&nbsp;Contact Us</span></a></li>
        <li><a href="about.php"><i class="glyphicon glyphicon-search"></i><span>&nbsp;About Us</span></a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="register.php"><i class="glyphicon glyphicon-registration-mark"></i><span>&nbsp;Register</span></a></li>
        <li class="active"><a href="login.php"><i class="glyphicon glyphicon-user"></i><span>&nbsp;Login</span></a></li>
      </ul>
    </div><!--/.nav-collapse -->
  </div>
</div>

这是演示。 http://jsfiddle.net/5TATB/

提前致谢!

1 个答案:

答案 0 :(得分:1)

根据我在控制台中看到的内容,你没有在jsfiddle上包含jquery框架,我相信你已经在代码中完成了它。

See this

Bootstrap是使用jquery补码构建的。在使用bootstrap nice javascript插件之前,您必须在jquery之前添加bootstrap.min.js

See documentation here!

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Working demo here