转自:如果用JavaScript获取标准下拉框的"选中值"和"选中文本" - Master HaKu - 博客园
在html中标准下拉框很常用,经常有这样的需求在下拉框改变的时候我们需要获取它的文本或值。
初学JS的朋友经常会把它的值和文本搞错,把两者混为一谈。
有的时候还会歪打正着,因为经常我们的值就是我们的文本,但是实际它们是不同的东西。
下面我们来举个例子。
我们先建立一个下拉框,如下:
<!--
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> < select name ="selOp" id ="selOp" onchange ="GetSelValue();" >
< option selected value ="a" > a1 </ option >
< option value ="b" > b2 </ option >
< option value ="c" > c3 </ option >
< option value ="d" > d4 </ option >
< option value ="e" > e5 </ option >
</ select >
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> < select name ="selOp" id ="selOp" onchange ="GetSelValue();" >
< option selected value ="a" > a1 </ option >
< option value ="b" > b2 </ option >
< option value ="c" > c3 </ option >
< option value ="d" > d4 </ option >
< option value ="e" > e5 </ option >
</ select >
JS代码如下:
<!--
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> function GetSelValue() {
var objSel = document.getElementById( " selOp " );
// 这是获取值
alert( " 当前值: " + objSel.value);
// 这是获取文本
alert( " 当前文本: " + objSel.options(objSel.selectedIndex).text);
}
Code highlighting produced by Actipro CodeHighlighter (freeware)
http://www.CodeHighlighter.com/
--> function GetSelValue() {
var objSel = document.getElementById( " selOp " );
// 这是获取值
alert( " 当前值: " + objSel.value);
// 这是获取文本
alert( " 当前文本: " + objSel.options(objSel.selectedIndex).text);
}