Цитирование по выбранным значениям в нескольких списках выбора JQuery

Question

У меня есть следующий сценарий.

У меня есть поле со списком, в котором доступен множественный выбор.

   <select id="a" multiple="multiple"> 
        <option value="">aaaa</option> 
        <option value="">bbbb</option> 
        <option value="">cccc</option> 
        <option value="">dddd</option> 
       </select> 

Теперь у меня есть кнопка

<button type="button" id="display">Display</button> 

Когда пользователь нажимает на эту кнопку, он должен перечислить все выбранные значения в раскрывающемся списке в окне предупреждения

Мой JS код выглядит следующим

$(document).ready(function() { 
       $('#display').click(function(){ 
        alert($('#a').val()); 
       }); 


     }); 

Все указатели будут оценены

Answer 1

Вы должны найти все выбранные опции:

jQuery(function($) { 
    $('#display').click(function() { 
     $('#a > :selected').each(function() { 
      alert($(this).text()); // using text() here, because the 
     });       // options have no value..? 
    }); 
}); 

---

Руководства, Пим отметил, полезно: метод

.val() в основном используется для получения значения элементов формы. В случае элементов <select multiple="multiple"> метод .val() возвращает массив, содержащий каждый выбранный параметр.

Таким образом, выше должно работать, но JQuery уже делает это за кулисами для вас, так что это намного проще:

alert($('#a').val().join(", ")); 

Если это не работает для вас, это может быть из-за факт, что ваши варианты, похоже, не имеют ценности.

Answer 2

страница JQuery документировании функции .val() буквально говорит вам, что делать: http://api.jquery.com/val/

Answer 3

Вы пробовали each()?

Answer 4

В следующих демонстрационных версиях я сделал материал для вышеуказанной проблемы.

Демо:http://codebins.com/bin/4ldqp9w

HTML:

<select id="a" multiple="multiple"> 
    <option value=""> 
    aaaa 
    </option> 
    <option value=""> 
    bbbb 
    </option> 
    <option value=""> 
    cccc 
    </option> 
    <option value=""> 
    dddd 
    </option> 
    <option value=""> 
    eeee 
    </option> 
    <option value=""> 
    ffff 
    </option> 
    <option value=""> 
    gggg 
    </option> 
</select> 
<div id='result'> 
</div> 

<p> 
    <button type="button" id="display"> 
    Display 
    </button> 
</p> 
<p> 
    <button type="button" id="reset"> 
    Reset 
    </button> 
</p> 

CSS:

#a{ 
    display:inline-block; 
} 
#result{ 
    display:inline-block; 
} 

JQuery:

$(document).ready(function() { 
    $('#display').click(function() { 

     var result = ''; 
     $('#a > :selected').each(function() { 
      result += "<div>" + $(this).text() + "</div>"; 
     }); 
     if (result == "") { 
      result = "<div>Please select any option(s)..!</div>"; 
     } 
     $("#result").html(result); 

    }); 
    $('#reset').click(function() { 
     $('#a > :selected').each(function() { 
      $(this).removeAttr('selected'); 
     }); 
     $("#result").html(''); 

    }); 
});