使用 JavaScript 检查多选框中是否已存在选项答案

【问题标题】：Check if an option already exists in a multi select box using JavaScript使用 JavaScript 检查多选框中是否已存在选项
【发布时间】：2014-06-11 16:36:28
【问题描述】：

我的问题与此相同 - How can I check whether a option already exist in select by JQuery

虽然我想知道如何使用 JavaScript 而不是使用 jQuery 来完成它。我试过使用 indexOf() 、 === 等，但我不确定我的方法是否正确。

P.S ：如果您将其标记为重复，请将我与在 JavaScript 中有答案的问题联系起来。谢谢。

此外，欢迎提出反对的理由。

我的方法：

var foldersList = document.getElementById("folders");
    for(var i=0; i<foldersList.length; i++)
    {
       if(!(foldersList.options[i].value.indexOf("someValue") === -1))
       {
             //do something
       }
    }

【问题讨论】：

您能否展示您的方法，并说明您认为它不正确的原因？ document.querySelectorAll('select option[value="something"]').length > 0 ?
您能展示一下您是如何尝试的，并告诉我们究竟是什么没有奏效吗？
我遍历选择框搜索值，这是正确的做法吗？
看来foldersList.length应该是foldersList.options.length。
@ivarni—选择元素做有一个options集合。 @jack——选择元素 do 有一个 length 属性，它是选项的数量（即选择的 options 集合的长度）。

标签： javascript

【解决方案1】：

你可以使用document.querySelectorAll:

document.querySelectorAll('#yourSelect option[value="yourValue"]').length > 0

同理：

$("#yourSelect option[value='yourValue']").length > 0;

【讨论】：

如果我没记错的话，后代选择器在 IE8 中不起作用。不过，实际上，是时候停止针对 IE8 了。
@ivarni — 与其说是“定位” IE8，不如说是支持使用它的用户，约占 IE 用户的 1/4（当然，这取决于您相信谁的统计数据）。 :-)
虽然“目标”可能不是最佳选择，但我仍然认为我们需要尽快从 IE8 继续前进。是的，人们正在使用它，但我们支持它并不能帮助他们从中迁移。

【解决方案2】：

var yourSelect = document.getElementById("yourSelect");
for (i = 0; i < yourSelect.length; ++i) {
   if (yourSelect.options[i].value == "someValue") {
      alert("someValue is available");
   }
}

【讨论】：

【解决方案3】：

简单的方法，即使是最古老的浏览器也支持：

function selectHasOption(select, value)
{
    for (var i = 0, len = select.options.length; i != len; ++i) {
        if (select.options[i].value == value) {
            return true;
        }
    }
    return false;
}

这是表达式：

selectHasOption(document.getElementById('folders'), 'someValue')

【讨论】：