Question

我有一个多重选择，如此配置为自动填充：

     <select id="multiple-select-box" class="selectivity-input" data-placeholder="Type to search condos" multiple>     
            <option id="Alabama Grove Terrace" value="Alabama Grove"  >Alabama Grove Terrace</option>
            <option id="Alden Pines" value="Alden Pines"  >Alden</option>  
    </select>

选择后，我意识到脚本正在为每个选项提交可见文本而不是值=＆＃34;＆＃34;对于所选择的每个选项。

我试图改变var t = $（this）.text（）; to var t = $（this）.value（）;认为这将获取值而不是选项文本，但具有相同的结果。我错过了什么？

<script>
            $(document).ready(function() {

                        $("#bySub").submit(function(){
                            $(".selectivity-multiple-selected-item").each(function(){
                            var t=$(this).text();
                            //if()
                            $(".ml").append("<option selected='selected'>"+t+"</option>");
                        });

                        })

                $('#multiple-select-box').selectivity();


            });
        </script>

Answer 1

好的，所以我去检查你正在使用的这个选择性插件，并将你的select转换成一系列divs

<div class="selectivity-results-container">
    <div class="selectivity-result-item highlight" data-item-id="Alabama Grove">Alabama Grove Terrace</div>
    <div class="selectivity-result-item" data-item-id="Alden Pines">Alden</div>
</div>

您必须更改submit功能才能获得与原data-item-id select对应的value属性

$("#bySub").submit(function(){
    $(".selectivity-multiple-selected-item").each(function(){
    var t=$(this).data("item-id");
    $(".ml").append("<option selected='selected'>"+t+"</option>");
});

修改

fiddle example

Answer 2

在此行中，您要向select附加选项，但您没有设置值属性：

 $(".ml").append("<option selected='selected'>"+t+"</option>");

Answer 3

如评论中所述，jQuery中表单元素的“fetch value”方法是：

$(this).val()

您可能会将其与JavaScript属性混淆：

this.value

......这也有效。如果选择了某些内容并将其设置为“multiple”，则两者都返回一个字符串数组

要跟进你的评论，我没有看到所选元素的标记为class =“ml”，因此几乎不可能调试为什么你的表单没有提供值而没有看到更大的图片（即它可能在表单元素之外）。您可以尝试将value属性添加到select元素，但是jQuery应该能够通过使用文本值来选择缺少value属性的选定选项。

jQuery Autopopulate Multiple Select使用文本而不是值

3 个答案: