2015-01-15 2 views
0

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

Вот код в головной секции:

<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <meta name="description" content=""> 
     <meta name="author" content=""> 
     <link rel="icon" href="../../favicon.ico"> 

     <title>Jumbotron Template for Bootstrap</title> 

     <link href = "<?php echo base_url(); ?>css/bootstrap.min.css" rel="stylesheet" type="text/css" /> 

     <link href = "<?php echo base_url(); ?>css/jumbotron.css" rel="stylesheet" type="text/css" /> 

     </head> 
     <body> 
     <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> 
      <div class="container"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       </button> 
       <a class="navbar-brand" href="#">Landing Page System</a> 
      </div> 
      <div id="navbar" class="navbar-collapse collapse"> 
       <ul class="nav navbar-nav"> 
       <li><a href="#">Link</a></li> 
       <li class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Dropdown <span class="caret"></span></a> 
       <ul class="dropdown-menu" role="menu"> 
       <li><a href="#">Action</a></li> 
       <li><a href="#">Another action</a></li> 
       <li><a href="#">Something else here</a></li> 
       <li class="divider"></li> 
       <li><a href="#">Separated link</a></li> 
       <li class="divider"></li> 
       <li><a href="#">One more separated link</a></li> 
       </ul> 
      </li> 
      </ul> 
      </div> 
      </div> 
     </nav> 

Для колонтитула кода:

<footer> 
     <p>&copy; Company 2014</p> 
     </footer> 
    </div> <!-- /container --> 


    <!-- Bootstrap core JavaScript 
    ================================================== --> 
    <!-- Placed at the end of the document so the pages load faster --> 
    <script type="text/javascript" src="<?= base_url(); ?>js/bootstrap.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 
    <script type="text/javascript" src="<?= base_url(); ?>js/ie10-viewport-bug-workaround.js"></script> 
    </body> 
</html> 
+0

Проверьте свою консоль ... вы получаете эту ошибку; «Неиспользуемая ошибка: JavaScript для Bootstrap требует jQuery» – Craig

ответ

1

Вам нужно включить jquery.min.js перед bootstrap.min.js

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
<script type="text/javascript" src="<?= base_url(); ?>js/bootstrap.min.js"></script> 
+0

Удивительно! это работает. –

0

Всегда добавляйте jquery.min.js в верхней части всех js

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