javascript - 如何让下拉框里面显示的值不是这个值呢？

Question

我想使用 javascript 在下拉列表中获取值(不是值)例如

<select id="mySelect" onchange="myFunction()">
<option value="1">Audi</option>
<option value="2">BMW</option>
<option value="3">Mercedes</option>
<option value="4">Volvo</option>
</select>

当我选择 audi 时，我想获得值 Audi 而不是值“1”

<script>
function myFunction() {
var x = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + x;
}
</script>

Answer 1

使用 jQuery，您可以这样做。监听下拉列表的change事件，获取选中选项的内部文本。

$("#mySelect").change(function() {
  console.log($(this).find("option:selected").text());
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="mySelect">
  <option value="1">Audi</option>
  <option value="2">BMW</option>
  <option value="3">Mercedes</option>
  <option value="4">Volvo</option>
</select>