javascript - 如何正确附加选择的更改

Question

我有一个非常简单的选择输入，允许多项选择。我想要做的只是在 PRE 中将选定的选项显示到跨度中。它在单选时似乎工作正常，但在选择多选时却不行。

例如，如果我选择多个选项，在我的 PRE 中它只显示 1 个项目而不是一个数组。

脚本: https://jsfiddle.net/

$('#selectpicker').on('change', function(){
    var test = $('#selectpicker').val();
    $.each(test, function (value) {
    $('#pre_support').html("");
    $('#pre_support').append("<span class='btn btn-primary btn-xs'>"+this+"</span>");
    });
});

有没有人有什么想法？

Answer 1

因为您在 $.each 循环的每次迭代中都清除了 pre_support 的 innerHtml。所以它会覆盖你设置为""的内容。

将其移出循环。

$('#pre_support').html(""); 
$.each(test, function (value) {       
    $('#pre_support').append("<span class='btn btn-primary btn-xs'>"+this+"</span>");
});