option.style.display =" none"不在safari工作 [英] option.style.display = "none" not working in safari

问题描述

这是我正在处理的示例： http://jsfiddle.net/4suwY/5/

This is the example I'm working on: http://jsfiddle.net/4suwY/5/

HTML：

<select id="asd">
    <option>hello</option>
    <option>I'M THE CHOSEN ONE</option>
    <option>asd</option>
    <option>wer</option>
    <option>qwe</option>
</select>

JS：

var sel = document.getElementById("asd");
var optnz = sel.getElementsByTagName("option")[1];
sel.value = optnz.value;
optnz.style.display = "none";

正如你所看到的，它可以在chrome中使用，但它不能在safari中工作。应该这样做，当你点击下拉菜单时，隐藏I'THE THE CHOSEN ONE选项。

As you can see, it works in chrome, but it does not work in safari.. What it should do, is hide the "I'M THE CHOSEN ONE" option when you click the dropdown menu..

这是我做的另一个测试： http://jsfiddle.net/4suwY/11/

This is another test I made: http://jsfiddle.net/4suwY/11/

同样的HTML，这是JS：

Same HTML, this is the JS:

var sel = document.getElementById("asd");
var opt = document.createElement("option");
opt.innerHTML = "YAYA";
opt.value = "YAYA";
sel.appendChild(opt);
sel.value = "YAYA";
opt.style.display = "none";

无论如何，我需要做的是显示一个选项作为选择

Anyway, what I need to do is display an option as selected (current), and hide to the user when the dropdown menu is opened, so he can't choose it.

任何建议/解决方法？我没有看到任何错误。 Safari有什么问题？我应该改变方法吗？ Jquery似乎没有帮助。

Any suggestion / workaround? I don't see any error. What's wrong with Safari? Should I change approach? Jquery seems not to help.

EDITS：

需要隐藏下拉菜单中的选项，但同时我需要显示此选项值作为选定的值！例如，closed下拉菜单将显示值I'M CHOSEN ONE，但如果我单击并打开菜单，唯一可见的选项将是hello，asd，wer，qwe..

I need to hide the options in the dropdownmenu, but at the same time I need to show this option "value" as the selected value! For example, the "closed" dropdown will show the value "I'M THE CHOSEN ONE", but if I click and open the menu, the only visible options will be "hello, asd, wer, qwe"..

推荐答案

您不能在Safari中切换显示< option> 或IE，就此而言）。这是一个长期和不一致的传统的一部分，Safari限制表单元素上的CSS样式功能，认为交互式元素的视觉语言应该与操作系统一致（没有点尝试找到IE的失败的理由）。

You can't toggle display on <option> elements in Safari (or IE, for that matter). This is part of a long and inconsistent tradition with Safari restricting CSS styling functionality on form elements, believing the visual language of interactive elements should be consistent with the OS (no point trying to find a rationale for IE's failings).

您的唯一选项是删除它（并稍后重新添加），或将其设置为 optnz.disabled = true 。对不起的坏消息！

Your only options are either to remove it (and re-append it later), or to set it to optnz.disabled = true. Sorry for the bad news!

这篇关于option.style.display =" none"不在safari工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！