检查 select 是否包含特定值答案

【问题标题】：Check if select contains a specific value检查 select 是否包含特定值
【发布时间】：2022-04-22 21:00:14
【问题描述】：

我有一个大约 50 个项目的选择，这是一个小样本。我想检查选择是否包含特定的确切值，所以在寻找“美”时，那将是 1 匹配而不是 2。

我想循环遍历所有项目，但后来我遇到了这个： http://api.jquery.com/is/

并认为这可能会表现得更好。但是，我不知道如何在此代码上使用它：

<select id="mydropdown" class="textbox">
    <option value="Beauty">Beauty</option>
    <option value="Catering">Catering</option>
    <option value="Beautysalon">Beautysalon</option>
</select>

【问题讨论】：

您是要检查select 是否包含Beauty 的option，还是检查它的当前值是否是Beauty？
如果选择中包含'Beauty'选项，所以我不在乎它是选择yes还是no。
然后使用约瑟夫的答案。

标签： jquery selection

【解决方案1】：

使用属性选择器：

var hasBeauty = !! $('#mydropdown > option[value="Beauty"]').length;

这是小提琴：http://jsfiddle.net/gLPJ5/

【讨论】：

【解决方案2】：

if($('#mydropdown').val() == "Beauty")
{
  //Do something
}

【讨论】：

【解决方案3】：

这是一种更快、更现代的解决方案，不使用querySelector 或jQuery。它的作用是获取options 对象，将其转换为数组并使用includes 检查值。所有方法都是原生 JS api 的一部分。

function optionExists (select, value) {
  const options = Object.values(select.options).map(option => option.value)
  return options.includes(value)
}

const select = document.getElementById('mydropdown')
console.log(optionExists(select, 'Beauty'))
console.log(optionExists(select, 'Be'))

<select id="mydropdown" class="textbox">
    <option value="Beauty">Beauty</option>
    <option value="Catering">Catering</option>
    <option value="Beautysalon">Beautysalon</option>
</select>

【讨论】：

【解决方案4】：

ES6 / 原版：

(select, optionValue) => [...select.options].some((o) => o.value == optionValue);

【讨论】：