我正在尝试制作它,以便当我单击倒塌按钮时,两个标签将出现,但是即使数据目标和ID和ID的数据键和ID也不会发生Navbar是相同的。
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#colnav">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">
<%= image_tag("iinfo.png", :alt => "INFOMAN") %>
</a>
</div>
<div class="collapse navbar-collapse" id="colnav">
<ul class="nav navbar-nav navbar-right" >
<li class="color-me">
<a href="#" style="color:red">
Contact Us
</a>
</li>
<li>
<% if current_user %>
<%= link_to 'Logout', session_path("new") , method: "delete"%>
<% end %>
</li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</nav>
bootstrap需要jQuery的效果。如果您需要通过其CDN进行引导,则需要确保将jQuery加载到application.html.erb
中。请参阅此官方模板。
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<h1>Hello, world!</h1>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
</body>
</html>
但是,如果您需要通过bootstrap Gem进行hootstrap,则需要确保gem 'jquery-rails'
在您的gemfile中,并且您的application.js
清单文件需要jQuery。
有关正确的安装详细信息,请参见GEM文档。
希望这会有所帮助!
当您未正确链接bootstrap.min.js
文件时,通常会发生此问题。