Bootstrap dropdown menu is not working

Navigation
1

My dropdown menu does not work. 

<div class="btn-group">
  <button type="button" class="btn btn-warning">Menu Dropdowb</button>
  <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
    <span class="caret"></span>
    <span class="sr-only">Toggle Dropdown</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Submenu1</a></li>
    <li><a href="#">Submenu2</a></li>
    <li><a href="#">Submenu3</a></li>
    <li class="divider"></li>
    <li><a href="#">Submenu4</a></li>
  </ul>
</div>
    <script type="text/javascrip">
$('.dropdown-toggle').click(function(e) {
    e.preventDefault();
    e.stopPropagation();

    return false;
});
$('.dropdown-menu').click(function(e) {
    e.preventDefault();
    e.stopPropagation();

    return false;
});
 $(document).ready(function () {
         $('.dropdown-toggle').dropdown();
     }); 

</script>
    
asked by anonymous 24.03.2015 / 21:05

2 answers

2

Bootstrap has a dependency: jQuery . Just include the library code before including the file bootstrap.js (or bootstrap.min.js ). 

<!doctype html>

<link rel='stylesheet' href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'/>

<div class="btn-group">
  <button type="button" class="btn btn-warning">Menu Dropdown</button>
  <button type="button" class="btn btn-warning dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
  <span class="caret"></span>
  <span class="sr-only">Toggle Dropdown</span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Submenu1</a></li>
    <li><a href="#">Submenu2</a></li>
    <li><a href="#">Submenu3</a></li>
    <li class="divider"></li>
    <li><a href="#">Submenu4</a></li>
  </ul>
</div>
    
<script src='http://code.jquery.com/jquery-2.1.3.min.js'></script>
<script src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js'></script>
<script>
  $(function () {
    $('.dropdown-toggle').dropdown();
  }); 
</script>
    
24.03.2015 / 22:30
0

See if <!DOCTYPE html> is not missing at the top of the HTML document.

If you do not have it, it's going to get weird anyway:

PuttingDOCTYPEcorrectlywilllooklikethis:

    
24.03.2015 / 22:00
How to use error_reporting Why does serialize form return empty textarea value?