在MSIE下将select的选项显示样式更改为none

时间:2010-02-08 21:32:44

标签: html css

有人可以告诉我为什么以下代码在MSIE下不起作用吗?

<html>
<body>
<select id="si">
<option value="">1</option>
<option value="">2</option>
<option value="">3</option>
</select>

<script type="text/javascript">
var e=document.getElementById("si");
e.size=3;
e[0].style.display="none"; // <-------- no effect
</script>

</body>
</html>

3 个答案:

答案 0 :(得分:4)

IE不允许您直接操作option元素。根据我的经验,您需要从option中删除所有select元素,并使用您想要应用的任何更改重新填充它们(在这种情况下,删除了一个元素)。

答案 1 :(得分:1)

对于那些在受影响的版本中需要处理隐藏选项元素的人,我在这里发布了一个解决方法,它不会克隆或删除选项,但会包围它们,这可以说更容易处理:

http://work.arounds.org/issue/96/option-elements-do-not-hide-in-IE/

答案 2 :(得分:0)

这似乎在MSIE下工作正常,希望没有“副作用”,如果你发现错误请告诉我,谢谢。

<html>
<body>
<select id="si">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>

<script type="text/javascript">
var e=document.getElementById("si");
e.size=3;
var a = new Array();
var n = new Array();
var x = 2;
if(!a.length)for(var i=0,m=e.length;i<m;i++) {
    a.push(e[i].value);
}
while(e.firstChild)
    e.removeChild(e.firstChild);
for(var i=0,m=a.length;i<m;i++) {
    if(x==a[i]) {
        e.add(new Option(a[i],a[i]));
    }
}
</script>

</body>
</html>