在Multple = On的下拉列表中显示选定的值 [英] Displaying Selected Values in Drop-Down List With Multple = On

问题描述

我正在尝试在下拉列表中显示 ALL 选定的值.下面显示的代码仅显示第一个值，但是我在理解如何使其显示所选的每个值上很费劲.

I'm trying to display ALL selected values in a drop down list. The code shown below works to display only the first value however I'm struggling on understanding how to get it to display each value that is selected.

function myFunction() {
var x = document.getElementsByName("Car").item(0).value;
document.getElementById("demo").innerHTML = "You selected: " + x;
}

<p>Select a new car from the list.</p>
<select name="Car" multiple="on" size="5" onchange="myFunction()">
<option value="Audi">Audi
<option value="BMW">BMW
<option value="Mercedes">Mercedes
<option value="Volvo">Volvo
</select>
<br>
The car is:
<p id="demo"></p>

https://jsfiddle.net/2gq824q2/12/

推荐答案

为什么不使用jQuery?

Why not use jQuery when you can?

function myFunction() {
    var x = $('#car').val()
    $('#demo').html("You selected: " + x.join(", "))
}
$('#car').change(function() {
  myFunction();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Select a new car from the list.</p>

<select id="car" name="Car" multiple="on" size="5">
  <option value="Audi">Audi
  <option value="BMW">BMW
  <option value="Mercedes">Mercedes
  <option value="Volvo">Volvo
</select>
<br>
The car is:
<p id="demo"></p>

这篇关于在Multple = On的下拉列表中显示选定的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！