Select 函数 onchange 两个不同的值
Select function to onchange two different values
美好的一天,
我有一个 select 标签的 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>
我的目标是,根据 selected 选项,它不仅会更改 demoA[=33= 中的 Value A ] span,还有 Value B in demoB span - 例如显示的选项名称(Value B1 或 值 B2).
有人可以帮我解决这个问题吗?如果无法检索选项标签之间的值,是否有替代解决方案可以提供相同的结果?
您可以从下拉列表中获取对当前所选选项的引用,并通过 .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>
美好的一天,
我有一个 select 标签的 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>
我的目标是,根据 selected 选项,它不仅会更改 demoA[=33= 中的 Value A ] span,还有 Value B in demoB span - 例如显示的选项名称(Value B1 或 值 B2).
有人可以帮我解决这个问题吗?如果无法检索选项标签之间的值,是否有替代解决方案可以提供相同的结果?
您可以从下拉列表中获取对当前所选选项的引用,并通过 .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>