我有navbar-collapse
。
如果我使用下面显示的代码,下拉菜单将停止工作。 (单击下拉项目不执行任何操作。)
<!-- Le styles -->
<link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/bootstrap-responsive.min.css" rel="stylesheet">
<style>
body { padding-top: 60px; /* 60px to make the container go all the way
to the bottom of the topbar */ }
</style>
<!-- Le javascripts -->
<script type="text/javascript" src='/js/jquery-1.9.1.min.js'></script>
<script type="text/javascript" src='/js/jquery.cookie.js'></script>
<script type="text/javascript" src='/js/bootstrap.min.js'></script>
删除ref to bootstrap.min.js使下拉列表正常工作。我糊涂了。我不应该同时包含.js和.css吗?
(我尝试在css文件之前包含jQuery。结果相同。) (我也试过在css之前加入javascript。结果相同。) 所有引导程序文件都直接从引导程序网站下载。
答案 0 :(得分:-1)
对bootstrap.js文件的引用很重要,因为其中包含下拉功能。在bootstrap.js的第637行,定义了下拉定义。喜欢:
var toggle = '[data-toggle=dropdown]'
, Dropdown = function (element) {
var $el = $(element).on('click.dropdown.data-api', this.toggle)
$('html').on('click.dropdown.data-api', function () {
$el.parent().removeClass('open')
})
}
与bootstrap.min.js中定义的方法相同,后者是bootstrap.js的缩小版本。删除对bootstrap.js文件的引用不会使下拉功能起作用。
另外我会建议你在页脚中使用javascripts ..比如
<script type="text/javascript" src='/js/jquery-1.9.1.min.js'></script>
<script type="text/javascript" src='/js/bootstrap.min.js'></script>
<script type="text/javascript" src='/js/jquery.cookie.js'></script>