javascript - 从选择框中删除指定的值

Question

如何从下拉（选择）框中动态删除选项？需要检索该值，然后手动删除该值。

IE

    [DROP DOWN BOX]
    Apples
    Oranges
    Pears
    Kiwis
    Mangos
    Strawberries

var option_to_delete = "梨"

一些代码可以动态搜索“Pears”的选择框选项，如果检测到，则将其删除。

预期结果：

    [DROP DOWN BOX]
        Apples
        Oranges
        Kiwis
        Mangos
        Strawberries

请不要使用 jQuery 库。

Answer 1

您可以遍历 中的子节点并<select>删除等于“梨”的子节点。innerTextvalue

我提供了一个这样做的jsfiddle：http: //jsfiddle.net/pcb8q/

Answer 2

此代码将遍历下拉框，如果其中一个元素等于您的变量option_to_delete。

var dropdown = document.getElementById('ID_OF_DROPDOWN');
var option_to_delete = "Pears"

for (i=0;i<dropdown.length;  i++) {
   if (dropdown.options[i].value==option_to_delete) {
     dropdown.remove(i);
   }
}

我从https://stackoverflow.com/a/7601791/298051改编了一些代码

Answer 3

你可以像这样构造你的html

    <select id="fruits">
        <option value="apples">Apple</option>
        <option value="oranges">Oranges</option>
        <option value="kiwis">Kiwis</option>
    </select>

然后在 JS

    var selectBox = document.getElementById('#fruits');
    var options = selectBox.getElementsByTagName('option');
    var optionToDelete = 'apples';

    for (var i = 0; i < options.length; i++) {
        if (options[i].value === optionToDelete) {
            selectBox.removeChild(options[i]);
        }
    }