原生js获取select的option项的label和value值

来源：互联网发布：ubuntu安装numpy 编辑：程序博客网时间：2024/05/22 12:28

1.利用原生js获取select选中option项的值和文本

2.将select的选中值和文本绑定到了两个文本框上

源码:

<!DOCTYPE html>
<html>
<head>
<title>select的取值</title>
</head>
<body>
<div>
国家
<select id="country" onchange="getVal()">
<option selected="selected" value="China">中国</option>
<option value="Canada">加拿大</option>
<option value="India">印度</option>
</select>
label:<input type="text" id="myLabel" readonly="readonly" />
value:<input type="text" id="myValue" readonly="readonly"/><br>
</div>
</body>
</html>
<script type="text/javascript">
//给label和value设置初值
window.onload = getVal();
//select的onchange调用函数
function getVal(){
var countrySelect = document.getElementById('country');//获取select的dom
var index = countrySelect.selectedIndex;//获取选中的index
var label = countrySelect.options[index].text; //获取标签值
var value = countrySelect.options[index].value;//获取value值
document.getElementById('myLabel').value = label;
document.getElementById('myValue').value = value;
}
</script>

阅读全文

0 0