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

问题描述

好的，下面是一些演示问题的示例代码.如果我单击 Firefox 中的按钮，第一个选项就会消失.如果我单击 chrome 中的按钮，没有任何反应，或者更确切地说，如果我检查第一个选项，它确实具有属性style='display:none'"，但 html 页面上的选项本身并未隐藏.

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>

为什么这在 chrome 中不起作用?

why doesn't this work in chrome?

推荐答案

解决方法是删除 option 元素以响应您的事件，并在需要时将它们添加回来.IIRC，IE 不允许您将 option 元素上的 display 设置为 none.我建议将删除的元素存储在一个数组中，以便您可以轻松地将它们添加回来.

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屋！