Javascript 使用div选择中的隐藏选项

是否可以在select with div中隐藏选项，然后使用

style.display=“none”

我使用过的Html代码：

<div class="test">
    <div class="optioncheck" id="text place">
        <select id="status" onChange="myFunction()">
            <option value="1">Texts</option>
            <div class="options" id="text"><option value="2">Text</option></div>
            <div class="options" id="text1"><option value="3">Text1</option></div>
        </select>
    </div>
    <div class="optioncheck" id="map" style="display:none;">
        Text
        <div class="optioncheck" id="map1" style="display:none;">
            Text
        </div>
    </div>
</div>

---

你不能直接。相反，您必须使用（或编写）javascript库来演示select选项的div。就像select2jquerylibrary一样。

您不能使用

display:none

在select中隐藏选项，如果您想隐藏选项，可以使用

$（“#状态选项[value=1]”。换行（“”）

并再次显示使用的特定选项

if（$（“#状态选项[value=2]”）。parent（）是（“span”））{
$（“#状态选项[value=2]”）。展开（）；
}

这将为您完成工作。
删除div，只使用选项。
这是您的代码，没有div



文本
正文
文本1
正文
正文
如果您只想隐藏第一个选项以外的一些选项，您可以通过简单的javascript来实现。

参考这把小提琴：


假设我们有以下html：

<select id="fruits_dropdown">
<option value='1' > Apple </option>
<option value ='2'> Banana </option>
<option value ='3'> Orange </option>
<option value ='4'> Cherry </option>
</select>

为什么要使用DIV？即使选项可以用简单的css隐藏？你不能用css隐藏它，相反，你应该用js代码删除并添加选项，方法是将它们存储在数组/对象中。你是否试图在select中隐藏某些项？问题不清楚。如果你查看JSFIDLE中的输出，您将只看到2个选项，而假设有4个选项可见。我刚刚在SuitGames再次验证了它
<div class="test">
    <div class="optioncheck" id="text place">
        <select id="status" onChange="myFunction()">
          <option value="1">Texts </option>
          <option id="text" value="2">Text</option>
          <option value="3">Text1</option>
        </select>
    </div>
    <div class="optioncheck" id="map" style="display:none;">
       Text
    <div class="optioncheck" id="map1" style="display:none;">
       Text
    </div>
</div>

<select id="fruits_dropdown">
<option value='1' > Apple </option>
<option value ='2'> Banana </option>
<option value ='3'> Orange </option>
<option value ='4'> Cherry </option>
</select>

document.querySelector('#fruits_dropdown option[ value="2"]').style.display='None';
document.querySelector('#fruits_dropdown option[ value="3"]').style.display='None';