在Twitter BootStrap嵌套下拉列表中托管一个选择列表(IE 9特定)

Hosting a select list within a Twitter BootStrap nested dropdown (IE 9 Specific)

本文关键字:选择 一个 Twitter 列表 IE 特定 下拉列表 嵌套 BootStrap      更新时间:2023-09-26

我使用最新版本的Twitter BootStrap创建了一个嵌套的下拉列表。我需要一个嵌套下拉列表中包含许多元素的选择列表。我可以让嵌套的下拉列表正常工作,选择选项显示没有问题。不幸的是,在IE9中,点击选择列表后,将鼠标移动到任何项目上都会导致下拉列表关闭。这个问题在其他浏览器中没有表现出来。更不幸的是,作为这项工作的一部分,我必须支持IE7+。

以下位置存在错误:http://jsfiddle.net/GtbSE/2/

有人能透露些什么吗?

从您的示例中,我可以更改它以允许IE中"channel"菜单选项中的下拉菜单,只需对您的fiddle进行一些小更改: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(); });