在Twitter BootStrap嵌套下拉菜單中託管選擇列表（IE 9 Specific）

Question

我有使用最新版本的Twitter BootStrap創建的嵌套下拉列表。我需要在嵌套下拉列表中包含許多元素的選擇列表。我能夠得到嵌套下拉工作正常，選擇選項顯示沒有問題。不幸的是，在IE9點擊進入選擇列表後，將鼠標移動到任何項目上會導致關閉下拉菜單。這個問題不會在其他瀏覽器中出現。更不幸的是，我作爲這項工作的一部分，必須支持IE7 + 。

有一個在錯誤的的jsfiddle：http://jsfiddle.net/GtbSE/2/

任何人能有何啓示？

Answer 1

從你的例子中，我可以改變它來允許在IE瀏覽器的'頻道'菜單選項中的下拉菜單中對你的小提琴進行一些小的修改：http://jsfiddle.net/amelvin/XxSTF/ - 但你需要重新設計風格。

我不知道引導程序是否被下拉菜單項弄糊塗了。

<span class="dropdown" id="filter-add"> 
    <a href="#filter-add" id="addFilter" class="dropdown-toggle" data-toggle="dropdown" > 
     More 
    </a> 
    <ul id="Channels" class="nav nav-pills"> 
     <li class="dropdown"> 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Channel</a> 
      <ul class="dropdown-menu">      
      <li> 
       <select> 
        <option value="1" >LIst Item 1</option> 
        <option value="2" >LIst Item 2</option> 
        <option value="3" >LIst Item 3</option> 
        <option value="4" >LIst Item 4</option> 
        <option value="5" >LIst Item 5</option> 
        <option value="6" >LIst Item 6</option> 
       </select> 
       </li> 
      </ul> 
     </li> 
     <li><a>Cancel</a></li> 
    </ul> 
</span> 

$('.dropdown select').click(function(e) { e.stopPropagation(); }); 

$("#Channels").hide(); 

$("#addFilter").click(function() { $("#Channels").show(); });