Javascript添加和删除选择选项答案

【问题标题】：Javascript adding and removing a select optionJavascript添加和删除选择选项
【发布时间】：2015-03-17 14:26:51
【问题描述】：

我正在尝试添加和删除基于另一个字段的选择选项。这个网站上有很多关于添加和删除选项的答案，但我只需要添加不存在的选项。到目前为止，我有：

function setCustomerOptions() {
    var customers = getField('select', 'Customer');
    if (getField('select', 'Campaign Type').value == 'Game' || getField('select', 'Campaign Type').value == 'Innovation') {
        for (var i=0; i<customers.length; i++) {
            if (customers.options[i].text == 'N/A') {
                customers.remove(i);
            }
        }
    } else {
        if ($.inArray('N/A', customers.options.text) == -1) {
            var opt = document.createElement('option');
            opt.value = 'N/A';
            opt.innerHTML = 'N/A';
            customers.appendChild(opt);
        }
    }
}

这成功地添加和删除了“N/A”选项，但是如果我选择了除初始条件之外的任何内容，我会不断添加额外的“N/A”。我认为 Jquery inArray 可能会有所帮助，但没有。

如何找到当前不存在的选择选项？

【问题讨论】：

你能把你的代码放在一个 JSFiddle 例子中吗？并显示 getField 定义，因为我没有看到它
这是一个类似问题的链接：stackoverflow.com/questions/646317/…
我已经添加了 JSFiddle: jsfiddle.net/imonkey/5u5hp7z2/4 它实际工作的地方。我的代码库是 Sharepoint 2007，这就是为什么我使用 getField 按标题而不是 id 进行选择的原因。可能有一些其他的 Sharepoint“功能”正在工作，导致 /N/A/ 被多次添加？
我意识到我没有打开 jsfiddle 中的 jquery 库。当我这样做时，即使它已经存在，它也会不断重新添加新选项。

标签： javascript

【解决方案1】：

试试这个..

<form>
  <select id="mySelect" size="8">
    <option>Apple</option>
    <option>Pear</option>
    <option>Banana</option>
    <option>Orange</option>
  </select>
</form>
<br>


<button type="button" onclick="myFunction()">Insert option</button>
<button onclick="myremove()">Remove</button>
<script>
function myFunction() {
    var x = document.getElementById("mySelect");
    var option = document.createElement("option");
    option.text = "Kiwi";
    x.add(option);
}
function myremove() {
    var x = document.getElementById("mySelect");
    x.remove(x.selectedIndex);
}
</script>

【讨论】：

这不是检查新选项以查看该选项是否已存在。 "仅在选项不存在时添加"

【解决方案2】：

我无法让任何一个 jquery 选项工作 [感谢 Steven 找到类似的问题]，所以最终用纯 javascript 长期处理：

function setCustomerOptions() {
    var customers = getField('select', 'Customer');
    if (getField('select', 'Campaign Type').value == 'Game' || getField('select', 'Campaign Type').value == 'Innovation') {
        for (var i=0; i<customers.length; i++) {
            if (customers.options[i].text == 'N/A') {
                customers.remove(i);
            }
        }
    } else {
        for (var i=0; i<customers.length; ++i) {
            if (customers.options[i].text == "N/A") {
                var optexist = 1;
                break;
            } else {
                var optexist = 0;
            }
        }
        if (optexist == 0) {
            var opt = document.createElement('option');
            opt.value = 'N/A';
            opt.innerHTML = 'N/A';
            customers.appendChild(opt);
        }
    }
}

【讨论】：