2

Я использую функцию обнуления bootstrap, которая не работает должным образом на нашем веб-портале IBM. Он отлично работает на функциональности «показать», но не работает в функции «Скрыть».Bootstrap Collapse не работает должным образом (скрыть не работает)

<a href="#demo" data-toggle="collapse"><span class=”icon”>Collapsible</span></a> 

<div id="demo" class="collapse"> 
Sample Code 
</div> 

я вижу в окне консоли управления «область вспененных» значение не изменится в нашем коллапсе, а также не изменить имя класса, как «рухнул» и разрушаться в».

Как это исправить.

+0

проверки, если вы повторили Jquery файлы. –

ответ

3

Ваш код работает! но он не работает должным образом без jquery.

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <title>Title</title> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
</head> 
<body> 

<div class="container"> 
    <a href="#demo" data-toggle="collapse"><span class=”icon”>Collapsible</span></a> 

    <div id="demo" class="collapse"> 
    Sample Code 
    </div> 
</div> 

</body> 
</html> 
0

загляните в, чтобы код ниже, может помочь вам

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> 
 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 
<input type="radio" name="group1" value="2" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" id="panel1">panel 1 <br> 
 
<input type="radio" name="group1" value="3" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" id="panel2"> panel 2 
 
<div class="panel-heading" id="collapse1" class="panel1"> 
 
    <div id="collapseTwo" class="panel-collapse collapse"> 
 
    <div class="panel-body"> 
 
     you are now in body of panel1 
 
    </div> 
 
    </div> 
 
</div> 
 
<div class="panel-heading" id="panel2" class="collapse"> 
 
    <div id="collapseThree" class="panel-collapse collapse"> 
 
    <div class="panel-body"> 
 
     you are now in body of panel 2 
 
    </div> 
 
    </div> 
 
</div>

0

я столкнулся с тем же проблемами, есть много причин для этого, убедитесь, что нет никаких повторных ссылок на странице для начальной загрузки библиотеки, для меня удаления повторяющихся ссылок работали.

+0

что вы имеете в виду повторные ссылки? – CodeMan

+0

Я использовал Asp.net, и он добавляет ссылку bootstrap сама по себе, например, как мы добавляем ссылку на таблицу стилей, VS добавляет ее самостоятельно, и я добавил ссылку на таблицу стилей загрузки и js-файлов снова на той же странице, для меня удаление дубликатов ссылок на файлы js и css. –

0

в

<head>  
    <script type="text/javascript" src="jquery-3.1.1.js"></script> 
    <script src="js/bootstrap.js"></script> 
</head> 

и в конце тела, вы добавляете:

<body> 
.............. 
    <script src="js/jquery-1.11.3.min.js"></script> 
</body> 

Этот код решить для вашей проблемы

Смежные вопросы