Drop down menu 使用JQuery检查值是否在选择列表中

如何使用JQuery检查值是否属于下拉列表？

使用

如果该选项的值是通过Javascript设置的，则该选项将不起作用。在这种情况下，我们可以执行以下操作：

var exists = false;
$('#select-box option').each(function(){
    if (this.value == 'bar') {
        exists = true;
        return false;
    }
});

---

以防您或其他人有兴趣在没有jQuery的情况下使用它：

var exists = false;
for(var i = 0, opts = document.getElementById('select-box').options; i < opts.length; ++i)
   if( opts[i].value === 'bar' )
   {
      exists = true; 
      break;
   }

---

这是另一个类似的选择。在我的例子中，我在构建选择列表时检查另一个框中的值。在进行比较时，我不断遇到未定义的值，因此我将检查设置为：

if ( $("#select-box option[value='" + thevalue + "']").val() === undefined) { //do stuff }

我不知道这种方法是否更昂贵。

为什么不使用过滤器

var thevalue = 'foo';    
var exists = $('#select-box option').filter(function(){ return $(this).val() == thevalue; }).length;

松散比较有效，因为exists>0为true，exists==0为false，所以您可以使用

if(exists){
    // it is in the dropdown
}

或将其合并：

if($('#select-box option').filter(function(){ return $(this).val() == thevalue; }).length){
    // found
}

或者，如果每个select下拉列表都有select BOXS类，这将为您提供一个包含以下值的selects的jquery对象：

var matched = $('.select-boxes option').filter(function(){ return $(this).val() == thevalue; }).parent();

如果！$'选择框'.findoption:包含'+thevalue+'。长度{ //做事

---

} 我知道这是一个老生常谈的问题，这个问题更有效

if(!$('.dropdownName[data-dropdown="' + data["item"][i]["name"] + '"] option[value="'+data['item'][i]['id']+'"]')[0]){
  //Doesn't exist, so it isn't a repeat value being added. Go ahead and append.
  $('.dropdownName[data-dropdown="' + data["item"][i]["name"] + '"]').append(option);
}

---

正如您在本例中看到的，我正在按唯一标记数据下拉列表名称和所选选项的值进行搜索。当然，您不需要这些选项，但我将它们包括在内，以便其他人可以看到您可以搜索多个值，等等。

有html选择集合，您可以检查每个选择是否具有特定值的选项，并过滤不符合条件的选项：

if ($select.find('option[value=' + val + ']').length) {...}

//get select collection:
let selects = $('select')
//reduce if select hasn't at least one option with value 1
.filter(function () { return [...this.children].some(el => el.value == 1) });

---

显式第二种方法也更安全，因为它允许包含任何字符的选项值，包括]和`\`。避免在未执行正确CSS-escaping的情况下从原始文本生成选择器字符串。Return false用于中断/结束每个循环。如果JavaScript使用此逻辑创建新选项：$'select-box'。追加$+text+；当然，在更为口语化的风格中，第一个示例可以工作，您不需要迭代。我似乎找不到第一个代码片段不工作的情况。我尝试了附加新选项和使用jQuery的val函数设置现有选项的值。在这两种情况下，第一个代码段仍然有效。在什么情况下它会失败？只是想指出在第一个示例中，您缺少值的引号。选项[value'+thevalue+']'这是最直观的方式。在您的解决方案中，下拉列表中的选项编号不是值。您的解决方案是错误的。为什么不仅仅是i++？++i前缀总是比postfix@csr nontolWelcome更快，等等。您的答案可以改进：添加代码描述。告诉我们它是如何工作的，以及它是如何解决问题的。

//get select collection:
let selects = $('select')
//reduce if select hasn't at least one option with value 1
.filter(function () { return [...this.children].some(el => el.value == 1) });