jQuery如何按值选择选项？答案

【问题标题】：jQuery how to select options by values?jQuery如何按值选择选项？
【发布时间】：2012-11-01 17:33:58
【问题描述】：

如何选择不在'restrictedIds'中的选项，例如选择器应该选择值为24和31的选项。我也知道如何使用 '.inArray' 和 '.each()' 来完成，但看看你的解决方案会很好。谢谢。

...
var restrictedIds='0,38,23';
...
<select class="text4" size="1" name="drivers">
        <option value="0"></option>
        <option value="24">test1</option>
        <option value="31">test2</option>
        <option value="38">test3</option>
        <option value="23">test4</option>
</select>

【问题讨论】：

如果要进行多选，则必须设置相应的属性。请发布您的尝试。
我想你误解了我，我想要带有选项对象的 jQuery 变量..
啊，我明白了.... 看到，最好也发布您的代码。 Select options 在这种情况下非常模糊。

标签： jquery select

【解决方案1】：

你应该看看这些文章：
http://api.jquery.com/attribute-equals-selector/
http://api.jquery.com/attribute-not-equal-selector/
http://api.jquery.com/multiple-attribute-selector/

你可以做的是从白名单中只选择选项，即

$('option[value=24],option[value=31]')

但我不确定这是否比 .each() 快..

【讨论】：

【解决方案2】：

您可以使用.filter。为了获得更好的性能，我建议创建一个 ID 映射：

var restrictedIds = {
    0: true,
    28: true,
    23: true
};

var options = $('select[name="drivers"] option').filter(function() {
    return !restrictedIds[this.value];
    //or   !(this.value in restrictedIds)
});

【讨论】：

【解决方案3】：

最简单的方法是使用 val 函数http://api.jquery.com/val/。它支持读取和写入值以选择具有多个选项。

这是一个可能适合您的示例。

<!DOCTYPE html>
<html>
<head>
  <style>
  p { color:red; margin:4px; }
  b { color:blue; }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <p></p>
  <select id="single">
    <option>Single</option>
    <option>Single2</option>

  </select>
  <select id="multiple" multiple="multiple">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
  </select>
<script>
    function displayVals() {
    $("#multiple").val([1,3]);
      var singleValues = $("#single").val();
      var multipleValues = $("#multiple").val() || [];
      $("p").html("<b>Single:</b> " + 
                  singleValues +
                  " <b>Multiple:</b> " + 
                  multipleValues.join(", "));
    }

    $("select").change(displayVals);
    displayVals();

</script>

</body>
</html>

【讨论】：