使用JavaScript或Jquery获取标准下拉框的"选中值"和"选中文本"

 iLife's 博客http://blog.csdn.net/fei1502816 

 

在html中标准下拉框很常用，经常有这样的需求在下拉框改变的时候我们需要获取它的文本或值。

初学JS的朋友经常会把它的值和文本搞错，把两者混为一谈。

有的时候还会歪打正着，因为经常我们的值就是我们的文本，但是实际它们是不同的东西。

下面我们来举个例子。

我们先建立一个下拉框，如下：

1. <select name="selOp" id="selOp" onchange="GetSelValue();">  
2.     <option selected value="a">a1</option>  
3.     <option value="b" >b2</option>  
4.     <option value="c" >c3</option>  
5.     <option value="d" >d4</option>  
6.     <option value="e" >e5</option>  
7. </select>  

 

JS代码如下：

1. function GetSelValue() {  
2.         var objSel = document.getElementById("selOp");  
3.           
4.         //这是获取值  
5.         alert("当前值: " + objSel.value);  
6.           
7.         //这是获取文本  
8.         alert("当前文本: " + objSel.options(objSel.selectedIndex).text);  
9. }  

JQuery代码如下：

1. function getSelect(){  
2.     //获取选中下拉框的值  
3.     var selValue = $("#下拉框ID option:selected").val();  
4.     //获取选中下拉框的文本  
5.     var selText  = $("#下拉框ID option:selected").html();  
6. }