Question

我有一个禁用滚动条的select多元素。在Windows上的Chrome和Firefox中，它仍然可滚动，但无法进行选择。但是在IE中它不可滚动，因此不能看到所有选项。

有没有办法迫使IE以同样的方式表现得像Chrome / FF？这基本上是多选选项列表的只读表示，他们可以看到哪些元素被选中。

这是一些示例代码和小提琴（http://jsfiddle.net/2ET44/2/：

<select multiple size="5" style="max-height:50px" disabled>
    <option>value number 1</option>
    <option>val 2</option>
    <option>val 3</option>
    <option>val 4</option>
    <option>val 5</option>
    <option>value 6</option>
    <option>val 7</option>
    <option>val 8</option>
    <option>val 9</option>
    <option>val 10</option>
</select>

谢谢！

Answer 1

检查出来。
的 HTML：

<div id="options"> <select multiple size="5" style="height:165px" disabled> <option>value number 1</option> <option>val 2</option> <option>val 3</option> <option>val 4</option> <option>val 5</option> <option>value 6</option> <option>val 7</option> <option>val 8</option> <option>val 9</option> <option>val 10</option> </select> </div>

<强> CSS：

#options { height:50px; width:115px; overflow-x:hidden; }

这是小提琴：http://jsfiddle.net/2ET44/4/

IE只是以另一种方式行事。你可以通过使用div来处理滚动来解决这个问题。

Answer 2

尝试禁用选项而不是选择

{
  var OSName = "Unknown OS";
  if (navigator.userAgent.indexOf("Win") != -1) OSName = "Windows";
  if (navigator.userAgent.indexOf("Mac") != -1) OSName = "Macintosh";
  if (navigator.userAgent.indexOf("Linux") != -1) OSName = "Linux";
  if (navigator.userAgent.indexOf("Android") != -1) OSName = "Android";
  if (navigator.userAgent.indexOf("like Mac") != -1) OSName = "iOS";
  console.log('Your OS: ' + OSName);
}

垂直滚动禁用<select>多个元素在IE中不起作用</select>

2 个答案: