Как сделать выпадающее меню ботстрапа версии 2?

Question

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

HTML

<div id="tabs" style="border: 0px; width:100%;"> 
    <ul id="uTabs">  
     <li><a href="#tabs-1"><strong>Teacher</strong></a></li> 
     <li><a href="#tabs-2"><strong>Student</strong></a></li> 
    </ul> 
    <div id="tabs-1" class="PageContent"> 
    </div> 
    <div id="tabs-2" class="PageContent"> 
    </div>  
</div> 

JS

<script type="text/javascript"> 
    $(function() { 
     $tabs = $('#tabs').tabs(); 
     $tabs.tabs({select: function (event, ui) { 
       if (ui.index == 0 || ui.index == 1 || ui.index == 2) { 
       } 
       var url = $.data(ui.tab, 'load.tabs'); 
       if (url) { 
        location.href = url; 
        return false; 
       } 
       return true; 
      }}); 
    }); 
</script> 

Answer 1

вы можете использовать

самозагрузки-tabdrop.js

здесь ссылку скачать https://github.com/jmschabdach/bootstrap-tabdrop

вы можете использовать его, как это

      <ul class="nav nav-tabs"> 
            <li class="active"> 
             <a href="#tab_1_1" data-toggle="tab"> Home </a> 
            </li> 
            <li> 
             <a href="#tab_1_2" data-toggle="tab"> Profile </a> 
            </li> 
            <li class="dropdown"> 
             <a href="javascript:;" class="dropdown-toggle" data-toggle="dropdown"> Dropdown 
              <i class="fa fa-angle-down"></i> 
             </a> 
             <ul class="dropdown-menu" role="menu"> 
              <li> 
               <a href="#tab_1_3" tabindex="-1" data-toggle="tab"> Option 1 </a> 
              </li> 
              <li> 
               <a href="#tab_1_4" tabindex="-1" data-toggle="tab"> Option 2 </a> 
              </li> 
              <li> 
               <a href="#tab_1_3" tabindex="-1" data-toggle="tab"> Option 3 </a> 
              </li> 
              <li> 
               <a href="#tab_1_4" tabindex="-1" data-toggle="tab"> Option 4 </a> 
              </li> 
             </ul> 
            </li> 
           </ul>