Bootstrap“collpase in”not working

我正在使用bootstrap切换div元素。我正在使用下面的代码，它的默认行为，即在开始时隐藏切换的内容。Bootstrap“collpase in”not working

我想在开始处显示切换的内容，因此使用他们网站上建议的“折叠”引导类。但它仍然默认行为是在开始时隐藏内容。

代码片断

<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">+ Datum</button> 
<div id="demo" class="collapse in"> 
    <div> 
     <label>Attributes (Element) </label> 
    </div> 
</div>

注：所有必需的文件已被添加，即引导和jQuery文件引导工作。

任何人都可以帮助我吗？

来源

2016-11-15 Ajinkya Wani

我http://jsfiddle.net/h3WDq/1717/工作，可能是别的原因造成的问题，如果有可能创建一个小提琴！ – Afsar

也许你的javascript代码中有东西会导致这个bug – Beginner

Hi @zan你能告诉我你使用的是什么版本的bootstrap和jquery文件吗？ –

您的代码工作正常。某些方面bootstrap.min.js，& css丢失。

检查现场演示Here

摘录例

/* Latest compiled and minified CSS included as External Resource*/ 
 

 
/* Optional theme */ 
 
@import url('//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-theme.min.css'); 
 

 
body { 
 
    margin: 10px; 
 
}

<link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> 
 
<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">+ Datum</button> 
 
<div id="demo" class="collapse in"> 
 
    <div> 
 
     <label>Attributes (Element) </label> 
 
    </div> 
 
</div>

来源

2016-11-15 06:51:58

等等。问题出现后，再插入你的问题完整的代码。其他明智的代码工作。 –

无法插入完整的代码，因为它的尺寸太大，并且分成多个文件。我已经将bootstrap和jquery文件包含在其他常见的地方。无论如何感谢您的关注.. :) –

请确认以下事项。

您已经包括引导JS和CSS和jQuery

除了jQuery的版本是最新的。

我附上了一个样本片段。这似乎对我来说很完美。

<html> 
 
<head> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
</head> 
 
<body> 
 

 
<div class="container"> 
 
<button type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">+ Datum</button> 
 
<div id="demo" class="collapse in"> 
 
    <div> 
 
     <label>Attributes (Element) </label> 
 
    </div> 
 
</div> 
 
</div> 
 

 
</body> 
 
</html>

来源

2016-11-15 07:05:22 Nitheesh

感谢您的关注和评论，这些都是有益的。问题解决了，在我们的项目解决方案中，我们有一些引导程序重写的类，所以类中的“崩溃”与其中一个重写的类冲突。

欢呼声..

来源

2016-11-15 09:28:23

Bootstrap“collpase in”not working

回答

相关问题