在选择选项菜单悬停时失去焦点答案

【问题标题】：On hover of select options menu loses focus在选择选项菜单悬停时失去焦点
【发布时间】：2012-08-03 14:55:31
【问题描述】：

我有一个菜单，菜单中的一项是select 元素。仅在 IE 8 中，当我将鼠标悬停在选择 options 上时，菜单失去焦点并关闭。它在 Firefox 中运行良好。任何帮助将不胜感激

代码可以参考thisfiddle。

注意：我愿意接受使用 js 和 jquery 的解决方案

EDIT ：我不想要选择的替代品。

【问题讨论】：

我在 IE9（没有 8 个可用）中使用 jQuery 愚弄了它。它并不完美，但它确实部分具有您想要达到的效果。 jsfiddle.net/vUger/1
@Stieffers ：现在菜单在选择失去焦点后保持打开状态。
我会选择 Sable Fost 的解决方案。使用 jQuery 在 IE 中管理解决方案似乎没有合理的方法。
Sables 选项有效，因为ul 的高度随着列表的增大而增长。对于select，ul 的高度不会随着options 的数量而增长。如果你能弄清楚如何通过选项数量来增加那个高度......
@Stieffers ：问题是我不允许更改选择。

标签： html menu internet-explorer-8

【解决方案1】：

删除 SELECT 选项。尝试用子列表替换它：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

    <body>
    <ul> Numbers
        <li>1</li>
        <li>2</li>
        <li>3</li>        
        <li>
            Select  -->
            <ul>
                <li>
                    One
                </li>
                <li>
                    Two
                </li>
                <li>
                    Three
                </li>
            </ul>
        </li>
    </ul>
</body>
</html>

这适用于 Chrome 和 IE。

【讨论】：