jQuery从下拉列表中删除一个选项，给定选项的文本/值

Posted 2023-02-16

【中文标题】jQuery从下拉列表中删除一个选项，给定选项的文本/值

【英文标题】：jQuery to remove an option from drop down list, given option's text/value

【发布时间】：2010-12-31 05:54:58

【问题描述】：

我有一个下拉列表，并想从中删除一个选项，给定该特定选项的文本/值。可以使用 jQuery 吗？就像“追加”在下拉列表中添加选项一样，是否有删除选项的功能？

我尝试搜索它，但我得到的只是删除下拉列表中的整个选项集的示例，这不是我想要的。

干杯

【参考方案1】：

$("option[value='foo']").remove();

或更好（如果页面中的选择很少）：

$("#select_id option[value='foo']").remove();

【讨论】：

如果 foo 是一个变量怎么办？那么语法会是怎样的呢？

@JeffJaffery: $("option[value='" + foo + "']").remove();

谢谢@Y.Shoham。这就是我使用它的方式 $(#select_id).find('option[value=' + foo + ']').remove();

@JeffJaffery：从你的笔记中不清楚它是否对你有用。但是，您必须在#select_id 周围加上撇号，例如：jsfiddle.net/8txh9t52

【参考方案2】：

本地化下拉元素后

dropdownElement = $("#dropdownElement");

使用 JQuery attribute selector 查找 <option> 元素

dropdownElement.find('option[value=foo]').remove();

【讨论】：

完美，谢谢！ （无论我走到哪里，我都找到了有关如何使用选择器选择单个选项的信息。我正在寻找如何删除一个选项，因为您已经选择了下拉菜单，这似乎是更典型的用例。）

这是比上一个更有效的答案：D

这就是我喜欢做事的方式，我第一次看到别人有这样明确和干净的纪律。在这种使用 JQuery 的方式上还有其他资源吗？

【参考方案3】：

我知道已经很晚了，但也可以使用以下方法：

<select id="type" name="type" >
    <option value="Permanent" id="permanent">I am here to stay.</option>
    <option value="toremove" id="toremove">Remove me!</option>
    <option value="Other" id="other">Other</option>
</select>

如果我必须删除第二个选项 (id=toremove)，脚本看起来像

$('#toremove').hide();

【讨论】：

无论您是将值硬编码到下拉列表中还是动态添加要标记并稍后删除的内容，这都有效。我使用theField.prepend('<option id="toRemove" selected="selected" value="TBD">TBD</option>'); 动态添加了一个选项，这样它就包含了一个类似上面的ID，然后尝试使用theField.find('id:toRemove').remove() 将其删除——但这没有用。所以我尝试了$('#toRemove').remove()（类似于你上面的，但是因为我在需要显示它时重新添加它，所以我使用remove()而不是hide()）并且这有效。谢谢你的想法。

【参考方案4】：

$('#id option').remove();

这将清除下拉列表。如果你想清除以选择值然后$("#id option:selected").remove();

【参考方案5】：

首先找到特定选择的类名。

$('#id').val('');
$('#selectoptionclassname').selectpicker('refresh');

【讨论】：

空白值，而不是隐藏可用选项。

【参考方案6】：

我已使用上述选项从 2 个下拉框中隐藏条目（首先选择城市，然后选择该城市内的区域）。它在屏幕上运行良好，但仍然可以通过键盘输入选择隐藏选项。

【参考方案7】：

当我们迭代具有相同元素但值不同的下拉菜单或在用户界面中说为多行数据时，许多人在使用此关键字时遇到困难。 ： 这是代码 sn-p ： $(this).find('option[value=yourvalue]');

希望你明白了。