使下拉菜单为多选

Question

我有2个下拉菜单，其中一个（第二个）是动态的，其值会根据第一个下拉菜单中选择的选项而变化。

JSFiddle结果： http : //jsfiddle.net/pgbw56vb/10/embedded/result/

有人可以告诉我如何使第二个下拉菜单成为多选吗？ 我在Jquery和html中真的很绿色。

JSFiddle： http : //jsfiddle.net/pgbw56vb/10/

 <select id="kategorie_oder_seite"></select>

 <select id="auswahl"></select>

 var data = {
 "Kategorie": ["Kraft", "Startseite", "Insurance", "Risk",],
 "Seite": ["http://jsfiddle.net/tony089/pgbw56vb/2/",     "https://stackoverflow.com/users/login?returnurl=%2fquestions%2fask"],
 };


 var $kategorien = $("#kategorie_oder_seite").on("change", function() {
 var seiten = $.map(data[this.value], function(seite) {
    return $("<option />").text(seite);
 });
 $("#auswahl").empty().append(seiten);
 });

 for (var kategorie in data) {
 $("<option />").text(kategorie).appendTo($kategorien);
 }

 $kategorien.change();

提前致谢。

Answer 1

您可以使用select标记的multiple属性并将其值设置为multiple 。 还请记住以数组形式设置name属性，以便您可以通过此select控件发送多个值。

例如。

<select multiple="multiple" id="kategorie_oder_seite" name="check[]"></select>

JsFiddle： http : //jsfiddle.net/pgbw56vb/10/

Answer 2

只需在“选择”标签上添加“多个”属性

Answer 3

将多个添加到您的选择标签。

 <select id="kategorie_oder_seite" multiple></select>  
 <select id="auswahl" multiple></select>