Kann ich ein Data-Toggle Dropdown auf einem li verwenden? In Bootstrap

Question

mache ich eine dropdown menu in bootstrap.
Jetzt verwende ich in der li ein a Element, wo beschrieben wird, um das Dropdown-Menü umzuschalten.

Aber ich will eigentlich setzen, was in den in die lia Element ist ... Weil die ganze li anklickbar sein.

Hoffen Sie, Jungs habe ich Trinkgeld für mich. ;)

Answer 1

Bitte wenden Sie 'dropdown' Klasse auf die li, wo Sie DropDown wie folgt hinzufügen möchten.

<ul class="list-group"> 
<li class="list-group-item dropdown"> 
    <a class="dropdown-toggle" data-toggle="dropdown"> 
     Applicatie Ontwikkeling 
    </a> 
    <ul class="dropdown-menu"> 
     <li class="list-group-item">HTML</li> 
     <li class="list-group-item">CSS</li> 
     <li class="list-group-item">jQuery</li> 
    </ul> 
</li> 
<li class="list-group-item">Netwerk Beheer</li> 
<li class="list-group-item">Server Beheer</li> 

Answer 2

können Sie nur das machen a Tag voller Breite nehmen und dann wird die gesamte li anklickbar.

.dropdown-toggle{ 
 
display:inline-block; 
 
    width: 100%; 
 
    cursor: pointer; 
 
}

<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.11.1/jquery.min.js"></script> 
 

 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
 

 
<ul class="list-group"> 
 
    <li class="list-group-item"> 
 
     <a class="dropdown-toggle" data-toggle="dropdown"> 
 
      Applicatie Ontwikkeling 
 
     </a> 
 
     <ul class="dropdown-menu"> 
 
      <li class="list-group-item">HTML</li> 
 
      <li class="list-group-item">CSS</li> 
 
      <li class="list-group-item">jQuery</li> 
 
     </ul> 
 
    </li> 
 
    <li class="list-group-item">Netwerk Beheer</li> 
 
    <li class="list-group-item">Server Beheer</li> 
 
</ul>