IE10 选择框问题答案

【问题标题】：IE10 Select box issueIE10 选择框问题
【发布时间】：2012-12-18 21:20:59
【问题描述】：

我在 IE10 中测试我的应用程序，发现选择框有一个奇怪的行为。所选选项突出显示，上方/下方选项显示在所选选项上方/下方。下拉框被隐藏。

这只发生在 IE10 中。在所有其他浏览器中，选项显示在选择框下方。

在 IE10 和 IE9 中尝试以下示例代码：

<!DOCTYPE html>
<html>
    <body>
        <select>
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="opel">Opel</option>
            <option value="audi">Audi</option>
        </select>
    </body>
</html>

有什么方法可以让选择框下方的选项像往常一样，或者 IE10 有什么 hack？

谢谢。

【问题讨论】：

标签： internet-explorer-10

【解决方案1】：

这是 Internet Explorer 10 中此控件的默认行为。根据列表中的项目数和屏幕大小，其他浏览器也会以不同方式显示菜单 - 尽管我认为 IE10 是唯一的浏览器当下拉菜单打开时，这将平衡选择元素上方和下方的项目数。

【讨论】：

select 在 Windows7 + IE10（预发行版）中也有相同的行为。

【解决方案2】：

使用 <select size="1"> 强制显示单行。这不是特定于 IE10 的 hack，但适用于所有方面。

【讨论】：

为什么投反对票？这不是一个明显的功能，而且，它是一个解决方案，无论它是否符合您的愿望/实施。感谢分享@Jan Wikholm

【解决方案3】：

IE10 中新行为的优点之一是它使触摸交互更加容易。此外，它与 Windows 其余部分的行为方式一致。目前没有办法改变这种行为。我已将反馈传递给 IE 团队。

【讨论】：

【解决方案4】：

我正在寻找解决站点中的相同问题...我发现最新的 Telerik 控件在 IE10 中“正确”或更正确地“以 IE9 方式”工作.. :-)

我没有使用过这个最新版本，也没有为 Telerik 工作，所以如果它让你感到痛苦，请不要射击信使..

http://demos.telerik.com/aspnet-ajax/dropdownlist/examples/overview/defaultcs.aspx

【讨论】：