选择函数来改变两个不同的值答案

【问题标题】：Select function to onchange two different values选择函数来改变两个不同的值
【发布时间】：2018-12-23 22:14:29
【问题描述】：

早安，

我有一个用于选择标签的 onchange 函数，如下所示：

function dropdown() {
	var x = document.getElementById("mySelect").value;
	document.getElementById("demoA").innerHTML = "" + x;
}

<select id="mySelect" onchange="dropdown()">
	<option value="Value A1">Value B1</option>
	<option value="Value A2">Value B2</option>
</select>

<span id="demoA">Value A</span>
<span id="demoB">Value B</span>

我的目标是，根据所选选项，它不仅会更改 demoA 范围中的 Value A，还会更改 Value B demoB 跨度中的 em> - 例如显示的选项名称（Value B1 或 Value B2）。

有人可以帮我解决这个问题吗？如果无法检索选项标签之间的值，是否有其他解决方案可以提供相同的结果？

【问题讨论】：

标签： javascript html select onchange option

【解决方案1】：

您可以从下拉列表中获取对当前选定选项的引用，并通过.text 属性访问其文本值。

function dropdown() {
    var x = document.getElementById("mySelect");
    var val = x.value;
    var txt = x.options[x.selectedIndex].text;
    document.getElementById("demoA").innerHTML = "" + val;
    document.getElementById("demoB").innerHTML = txt;
}

<select id="mySelect" onchange="dropdown()">
    <option value="Value A1">Value B1</option>
    <option value="Value A2">Value B2</option>
</select>

<span id="demoA">Value A</span>
<span id="demoB">Value B</span>

【讨论】：

像魅力一样工作！非常感谢@garroad_ran