jQuery 选择值

Question

所以我在下拉菜单中使用了一个名为 Chosen 的 jQuery 插件，我注意到我在选项中的值不在所选列表中

这是默认值：

<select id="coating">
    <option value="0">Varnish</option>
    <option value="50">Gloss</option>
    <option value="34">Matte</option>
    <option value="0">Overlaminate</option>
    <option value="10">Clear Gloss</option>
    <option value="11">Clear Matte</option>
</select>

选择的结果如下：

<ul class="chosen-results">
    <li class="active-result" data-option-array-index="0">Varnish</li>
    <li class="active-result" data-option-array-index="1">Gloss</li>
    <li class="active-result" data-option-array-index="2">Matte</li>
    <li class="active-result" data-option-array-index="3">Overlaminate</li>
    <li class="active-result" data-option-array-index="4">Clear Gloss</li>
    <li class="active-result" data-option-array-index="5">Clear Matte</li>
</ul>

所以我想知道是否有办法将选项中的值转移到所选列表中。

Answer 1

使用这个你可以获得你select的值。

$("#coating")
  .chosen()
  .change(function() {
    alert($(this).val())
  })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="http://harvesthq.github.io/chosen/chosen.css" rel="stylesheet" />
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js"></script>
<select id="coating">
  <option value="0">Varnish</option>
  <option value="50">Gloss</option>
  <option value="34">Matte</option>
  <option value="0">Overlaminate</option>
  <option value="10">Clear Gloss</option>
  <option value="11">Clear Matte</option>
</select>

Answer 2

已更新以包含 optgroup

有了这个...

<select id="coating">
    <optgroup label="Varnish">
        <option value="50">Gloss</option>
        <option value="34">Matte</option>
    </optgroup>
    <optgroup label="Overlaminate">
        <option value="10">Clear Gloss</option>
        <option value="11">Clear Matte</option>
    </optgroup>
</select>

你可以这样做：

$("#coating").change(function() {
    var v = $(this).val();
    alert(v);
});

https://jsfiddle.net/jreljac/a38vLuoh/1/

您应该得到您期望的值。此插件使用隐藏的 select 元素发送所有数据。如果您以传统形式提交，请确保包含 name 属性。

optgroup 标签为您将 select 中的项目分组 - 它们 select 不可用，该标签中的项目嵌套在它们下面 http://www.w3schools.com/tags/tag_optgroup.asp

jQuery 选择值

jQuery Chosen Value

javascript

jquery

jquery-chosen