javascript - 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

已更新以包含 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/

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

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