style.display ='none'在chrome中的选项标签上不起作用，但是它在firefox中 [英] style.display='none' doesn't work on option tags in chrome, but it does in firefox

问题描述

好吧，继承人一些示例代码，说明问题。
如果我点击在Firefox中的按钮，第一个选项消失。
如果我点击铬中的按钮，没有任何反应，或者更确切地说，如果我检查第一个选项，它确实具有属性style ='display：none'，但是html页面上的选项本身并不隐藏。

 < form> 
< select> 
< option> 1< / option> 
< option> 2< / option> 
< option> 3< / option> 
< / select> 
< input type =buttononclick =document.getElementsByTagName（'option'）[0] .style.display ='none'value =hide option 1> 
< / form> 
  

为什么不在chrome中工作？

选项元素，并在需要时添加它们。 IIRC，IE不允许你在选项上设置显示到 none c $ c>元素。我建议将删除的元素存储在数组中，以便您可以轻松地将其添加回来。

ok, heres some sample code that demonstrates the problem. if i click the button in firefox, the first option disappears. if i click the button in chrome, nothing happens, or rather if i inspect the first option, it does have the attribute "style='display:none'" but the option itself on the html page is not hidden.

<form>
<select>
<option>1</option>
<option>2</option>
<option>3</option>
</select>
<input type="button" onclick="document.getElementsByTagName('option')[0].style.display='none'" value="hide option 1">
</form>

why doesn't this work in chrome?

解决方案

The workaround is to remove the option elements in response to your event and add them back if and when they are needed. IIRC, IE will not allow you to set the display to none on option elements. I would advise storing the removed elements in an array so that you can easily add them back in.

这篇关于style.display ='none'在chrome中的选项标签上不起作用，但是它在firefox中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！