twitter-bootstrap Bootstrap 导航栏下拉菜单不起作用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19470737/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-21 18:54:31  来源:igfitidea点击:

Bootstrap navbar dropdown not working

twitter-bootstrap

提问by Cristiano

So I'm trying to get the dropdown in the navbar from Twitter Bootstrap to work, and I'm having some problems.

所以我试图让 Twitter Bootstrap 的导航栏中的下拉菜单正常工作,但我遇到了一些问题。

Here's my html:

这是我的 html:

<ul class="nav">
  <li class="active"><%= link_to 'Home', root_path %></li>
  <li><a href="#">Forums</a></li>
  <li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">World</a>
    <ul class="dropdown-menu">
      <li><%= link_to 'Current', current_path %></li>
      <li><%= link_to 'All', all_path %></li>
    </ul>
  </li>
</ul>

And I also have this in the <head>:

我也有这个<head>

<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-dropdown.js"></script> 

It's just not working, can anyone see anything wrong with it?

它只是不起作用,有人能看出它有什么问题吗?

回答by Leon

You are referring to a wrong JS file.

您指的是错误的 JS 文件。

Instead of your <script>tag you use, use the following:

<script>使用以下代码代替您使用的标签:

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>

You can read about it here

你可以在这里阅读

At the <ul>class definition, add the relevant navyou wish to use:

<ul>类定义中,添加nav您希望使用的相关内容:

<ul class="nav nav-tabs">

<ul class="nav nav-tabs">

-----------------------------^^

-----------------------------^^

or <ul class="nav nav-pills">

或者 <ul class="nav nav-pills">

You can also directly link to bootstrap-dropdown.js through as per your comment, but nevertheless you'd need bootstrap css and js included (I also updated the fiddle): https://netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js

您也可以根据您的评论直接链接到 bootstrap-dropdown.js,但是您仍然需要包含 bootstrap css 和 js(我还更新了小提琴): https://netdna.bootstrapcdn.com/twitter-bootstrap/2.0.4/js/bootstrap-dropdown.js

See fiddle

小提琴

Also - I see that you use RoR, so make sure it's not a RoR issue on top of the missing JS file.

另外 - 我看到你使用了 RoR,所以请确保它不是丢失的 JS 文件之上的 RoR 问题。

回答by Ravi Kashyap

I have the same issue with bootstrap drop-down(in rails). I resolved the issue by removing the //= require_tree .from application.js. And got worked.

我对 bootstrap 下拉(在 Rails 中)有同样的问题。我通过删除//= require_tree解决了这个问题 来自 application.js。并开始工作。

回答by Imtiaz Pabel

Update your jquery main file to 1.11.0 and only use bootstrap.min.js bootstrap.min.css and jquery main file

将您的 jquery 主文件更新为 1.11.0 并仅使用 bootstrap.min.js bootstrap.min.css and jquery main file