Отделяйте каждое значение запятой от множественного выбора

У меня есть <select multiple='multiple', и мне нужно показать выбранное значение в div или какой-либо другой части страницы.

Я сделал это, но строка все сработала. Как я могу отделить каждое значение запятой?

Я сделал живой пример с тем, что у меня было до сих пор.

Или, если хотите, вот код:

HTML:

<select multiple='multiple' id="selMulti">
     <option value="1">Option 1</option>
     <option value="2">Option 2</option>
     <option value="3">Option 3</option>
     <option value="4">Option 4</option>    
</select>
<input type="button" id="go" value="Go!" />
<div style="margin-top: 10px;" id="result"></div>

JS:

$("#go").click(function(){
     var selMulti = $("#selMulti option:selected").text();
     $("#result").text(selMulti);
});

Если вы выберете опции 1 и 2, результатом будет:

Option 1Option 2

Что мне нужно:

Option 1, Option 2

Спасибо

Ответ 1

Вам нужно сопоставить элементы массиву и затем присоединиться к ним:

$("#go").click(function(){
     var selMulti = $.map($("#selMulti option:selected"), function (el, i) {
         return $(el).text();
     });
     $("#result").text(selMulti.join(", "));
});

Рабочая демонстрация: http://jsfiddle.net/AcfUz/

http://api.jquery.com/jQuery.map/

Ответ 2

$("#go").click(function(){
     var textToAppend = "";
     var selMulti = $("#selMulti option:selected").each(function(){
           textToAppend += (textToAppend == "") ? "" : ",";
           textToAppend += $(this).text();           
     });
     $("#result").html(textToAppend);
});

Ответ 3

Один стиль линии:

 $("#selMulti option:selected").map(function(){return this.text}).get().join(', ');

Вывод:

"Option 1, Option 2"