Question

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中不起作用。它应该做什么，当你点击下拉菜单时隐藏“我'CHOSEN ONE”选项..

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

相同的HTML，这是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";

无论如何，我需要做的是显示一个选项（当前），并在下拉菜单打开时隐藏给用户，所以他不能选择它。

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

编辑：

我需要隐藏dropdownmenu中的选项，但同时我需要将此选项“value”显示为所选值！例如，“关闭”下拉列表将显示值“我是选择一个”，但如果我点击并打开菜单，唯一可见的选项将是“你好，asd，wer，qwe”..

Answer 1

您无法在Safari（或IE）中的<option>元素上切换显示。这是漫长且不一致的传统的一部分，Safari限制了表单元素上的CSS样式功能，认为交互元素的视觉语言应该与操作系统保持一致（没有必要试图找到IE失败的理由）。

您唯一的选择是将其删除（并在以后重新添加），或将其设置为optnz.disabled = true。抱歉，这是个坏消息！

option.style.display =“none”在safari中不起作用

1 个答案: