Question

＆lt;选项＆gt;我想隐藏的是标有“选择机会”的选项。当我点击从＆lt; select＆gt;创建的下拉列表时，我想隐藏此选项包含我创建的数组中的选项的标记。你可以看到我在这里创建的代码：＆lt; form action =“/ shop /＆lt;？php echo $ duration_link;？＆gt;”方法= “GET” ＆GT; ＆lt; select name =“filter_duration”id =“filter_duration”＆gt; ＆LT; PHP if（empty（$ _ GET ['company']））{ ？＆gt;＆lt; option value =“hi”selected＆gt;选择持续时间＆lt; /选项＆gt; ＆LT; PHP }其他{ ？＆GT; ＆lt; option value =“”已禁用所选＆gt;选择持续时间＆lt; /选项＆gt; ＆LT;！ - 这会禁用该选项，但在单击时隐藏它是非常理想的。＆lt; option value =“”＆gt;清除持续时间＆lt; /选项＆gt; ＆LT; PHP } foreach（$ duration_array as $ duration_title =＆gt; $ duration_time）{ ？＆gt;＆lt; option value =“＆lt;？= $ duration_time？＆gt;”＆gt;＆lt;？= $ duration_title？＆gt; ＆LT; /选项＆GT; ＆lt;！ - 这为下拉菜单设置了不同的选项持续时间数组 - ＆gt; ＆LT; PHP } ？＆GT; ＆LT; /选择＆GT; ＆lt;！ - Duration：＆lt; input type =“text”name =“filter_duration”＆gt; - ＆GT; ＆lt; input type =“submit”＆gt; ＆lt;！ - 这会创建一个提交信息的按钮 - - ＆GT; ＆LT; /形式＆GT; ＆LT; PHP $ duration = $ _GET ['filter_duration']; $ duration_link ='？filter_duration ='。 $ duration。 '＆安培; query_type_duration =或＃个人顶'; ？＆GT; 我尝试为它编写一些JavaScript，但我真的很陌生，所以我想我可能会在某个地方出错。你可以看到我在这里写的JavaScript： var e = document.getElementById（“filter_duration”）; var strDuration = e.options [e.selectedIndex] .text; e.onclick = function（）{ if（strDuration ==“Select Opportunity”）{ strDuration ['Select Opportunity']。style.display = block; } }; 如果您对我如何隐藏这个＆lt; option＆gt;有任何想法这将是一个重大的帮助！非常感谢，约书亚·戈麦斯

Answer 1

如果你不想使用jquery，你也可以使用普通的javascript。因为在IE中隐藏选项存在一些问题，所以最好删除一个你不想要的选项。看这里看它是如何工作的：https://jsfiddle.net/k8cx04kp/

document.querySelector("select").onclick = function() {
    document.querySelector("option[value='hi']").remove();
}

如果您想隐藏，可以像remove()一样更改行：

document.querySelector("option[value='hi']").style.display = "none";

Answer 2

如果我理解你的话，你根本不需要这样做。

您只需为该选项设置selected和disabled属性即可。

示例：

<select>
  <option value="" selected disabled>Select duration</option>
  <option value="1">1 minute</option>
  <option value="2">2 minutes</option>
  <option value="3">3 minutes</option>
</select>

请参阅jsfiddle

用户无法选择可选，但无论如何，html中的selected属性或修改其{{>>可以选择 1}}属性由软件。

因此，您只需要无条件地禁用该选项，并将selected属性放在正确的属性中。

Answer 3

 $(document).ready(function(){
    $('#filter_duration').on('click',function(){
           $("#filter_duration option[value='hi']").hide();
        });
      });

使用隐藏

Answer 4

尝试使用此脚本（您只需要添加JQuery）

$("#filter_duration").on('change', function (e) {
    var optionSelected = $("option:selected", this);
    var valueSelected = this.value;
    if( optionSelected.text() == 'Select Opportunity' ) {
        $('option[value="'+valueSelected+'"]', this).remove();
    }
});

单击时隐藏<select>标记中的特定选项

4 个答案: