我在一个中有许多独特的选项。我需要添加一个新的选项，前提是它是唯一的，并且不存在于现有选项中。

如何使用jquery查找给定的option是否已经存在于给定的select中？

例如：

1 2 3 4 5 6

<select id="combobox">     <option value="">Select one...</option>     <option value="Apple">Apple</option>     <option value="Banana">Banana</option>     <option value="Pears">Pears</option> </select>

• 新的有效选项：PEAR
• 新的无效选项：Apple

相关讨论

• 扩展到我的问题：是否有一个实用程序可以给我这两个集合的交集？(我知道我可以很容易地写出来，但是如果已经有了一些东西，我宁愿重用它)。例如，GivenOptions和NewOptions。我想把这两个交叉点加到givenoptions中。
• 注意我对你不区分大小写的请求的最新答复。
• "两个选项的交集"是什么意思？
• @Davidthomas现有选项(本例中的givenoptions:apple、banana、pears)。newoptions就像一个数组(我通过Ajax调用得到的，例如[apple，plums])。我想得到givenOptions和newOptions的交集，在这两个集合中找到唯一的元素，并将它们添加到givenOptions中。

---

1 2	if (!$("#combobox option[value='Apple']").length)     // Add it

使其可重复使用可以是：

1 2	if (!$("#combobox option[value='" + value +"']").length)     // Add it

现场演示

不区分大小写：

1 2 3

var isExist = !$('#combobox option').filter(function() {     return $(this).attr('value').toLowerCase() === value.toLowerCase(); }).length;?

完整代码：(演示版的)

1 2 3 4 5 6 7 8 9 10 11 12

$('#txt').change(function() {     var value = this.value;     var isExist = !!$('#combobox option').filter(function() {         return $(this).attr('value').toLowerCase() === value.toLowerCase();     }).length;     if (!isExist) {         console.log(this.value + ' is a new value!');         $('<option>').val(this.value).text(this.value).appendTo($('#combobox'));     } });?

现场演示

相关讨论

• 我怎么才能让这个案子不敏感呢？
• "头脑清醒"。请参阅更新。
• 令人惊叹的！你能解释一下jquery中的!!操作符是什么吗？我不明白这一部分：!!$('#combobox option').filter(...。
• "头脑清醒"。在这里读我的答案
• 谢谢你！这很有帮助。你知道一个实用程序能给我两个options的交集吗？(我知道我可以很容易地写出来，但是如果已经有了一些东西，我宁愿重用它)。例如，当前选项集的givenoptions和作为JSON数组接收的newoptions。我想把这两个交叉点加到givenoptions中。我的相关问题：stackoverflow.com/questions/10796413/&hellip；
• "头脑清醒"。它没有内置的方式。你得自己写。不是很难，接近3-5行代码。
• 当然可以。感谢您的更新：)

---

我想你应该用value而不是文本内容来搜索。在你的例子中，它们总是一样的，但可能它们不会总是……

1 2 3 4 5 6

var toAdd = 'Apricot',     combobox = $('#combobox'); if (!combobox.find('option[value="' + toAdd + '"]').length) {     combobox.append('<option value="' + toAdd + '">' + toAdd + '</option>'); }

---

假设新选项文本出现在newOption变量中：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

$('button').click(     function() {         var newOption = $('#newOptionInput').val(),             opts = [];         $('#combobox option').each(             function() {                 opts.push($(this).text());             });         if ($.inArray(newOption, opts) == -1) {             $('<option />')                 .val(newOption)                 .text(newOption)                 .appendTo('#combobox');         }     });?

JS小提琴演示。

编辑以更正上述代码(我忘记了$.inArray()返回-1，而不是在找不到值时返回false)，并使用更合适的选择器。

参考文献：

• appendTo()。
• each()。
• $.inArray()/jQuery.inArray()。
• push()。
• text()。
• val()。

相关讨论

• 这不会搜索给定页面上的所有"选项"吗？

---

1 2 3 4 5

if ($('#combobox').find('option[value="Pear"]').length) {   // there's pear } else {   // nope, no pear }

---

• 关于javascript：如何删除选择框的所有选项，然后添加一个选项并使用jQuery选择它？
• 关于javascript：使用jQuery作为JS对象向select中添加选项的最佳方法是什么？
• 关于javascript：在jQuery中添加表行
• 关于javascript：如何检查jquery中是否隐藏了元素？
• 关于javascript：使用jquery更改下拉列表的选定值
• 关于javascript：如何通过jquery知道选择了哪个单选按钮？
• 关于HTML：如何检查jquery中是否选中复选框？
• 关于javascript：如何在jquery中选择具有多个类的元素？

Copyright ©  码农家园 联系：[email protected]