Twitter bootstrap 3 禁用光标出现在 IE 11 的下拉选项顶部

Question

我在禁用的推特 bootstrap 'form-control' 输入元素的正上方有一个下拉列表。

<div>
    <select>
        <option> Option 1 </option>
        <option> Option 2 </option>
        <option> Option 3 </option>
        <option> Option 4 </option>
        <option> Option 5 </option>
        <option> Option 6 </option>
        <option> Option 7 </option>
    </select>
</div>
<div class="form-group">
    <input class="form-control" id="disabledInput" type="text" placeholder="Disabled input here..." disabled="" />
</div>

在 Internet Explorer 11 中，当我单击下拉菜单并将鼠标悬停在禁用输入前面的选项上时，光标变为红色停止符号。

演示（在 IE11 中试用）：http://jsfiddle.net/Lrupx0ca/

我只在 IE11 中注意到这种行为。 Chrome, Firefox & IE10 似乎没问题。对发生的事情有什么想法吗？以及关于如何 fix/workaround 这个问题的任何建议？

Answer 1

您好，这是 select 禁用光标

上的 IE 错误

请查看此link以进一步了解

见IE反馈点linkhttps://connect.microsoft.com/IE/feedbackdetail/view/963961

并查看有关此错误的讨论 link： https://github.com/twbs/bootstrap/issues/14528

Answer 2

这可能有点晚了，但是仍然会有人在寻找解决这个问题的方法，因为 Microsoft 还没有修复这个问题。

要避免这种情况，您唯一可以做的就是将禁用的输入元素的光标样式设置为默认值。在这种情况下，它可能看起来像这样：

.form-control:disabled {
    cursor: default;
}

请注意，这严格来说不是修复，而是一种避免丑陋下拉菜单的解决方法。

Twitter bootstrap 3 禁用光标出现在 IE 11 的下拉选项顶部

Twitter bootstrap 3 disabled cursor appearing on top of drop down options in IE 11

html

css

internet-explorer

twitter-bootstrap