使用javascript获取下拉列表框当中的文本值（对IE及firefox都适用）

近日工作中碰到一个问题，需要将用户点击下拉列表当中某个选项后，将其所选的内容保存起来，如下面的HTML代码：

<select onchange="isSelected(this.value);" id="city"> 
          <option value="1">北京</option> 
          <option value="2" >上海</option> 
          <option value="2" >广州</option>
 </select> 

  

也就是说当用户选择“上海”这一列时，需要将“上海”这个名称保存起来。其实方法很简单。看下面javascript代码：


function isSelected(value) {
var cityName;
    var city = document.getElementById("city");
       //获取选中的城市名称
       for(i=0;i<city.length;i++){
           if(city[i].selected==true){
            cityName = city[i].innerText;  //关键点
            alert("cityName:" + cityName);
           }
       }
  


大致解释一下，首先在HTML页面上有一个下拉框，并为此下拉框定了一个“city”的id，并为其绑定了一个onchange事件，通过此事件调用javascript函数。
在javascript函数当中，通过domcument对象获取当前下拉框的节点元素，由于节点的值并非只有一个，所以我们可以通过循环节点来得到每个选项的值。在循环的时候通过判断当前选项是否选中，如果选中则使用city[i].innerText 方式获取当前所选中的文本值。当然如果需要获取选项值，只需如此即可：city[i].value.
至此，通过以上方法在IE下已能达到所要的结果。但是，在FIREFOX下测试时，发现此法不起作用，最后通过查阅资料发现另外一个方法。将city[i].innerText 改为 city[i].text即可。这种方法对IE及FIXEFOX都适用！
 
注：写的内容算不上什么新鲜的事，只能说是自己工作中积累到的一点小经验！


 




 


 


 
 

  


  

    
3 
顶
0 
踩
    
分享到：
      
      
    
  

  

    

      如何使用AJAX方式将查询出的结果在当前页面 ...
      |
      在后台判断参数是否为空时应当注意的一点
    
  
  

    

      
2008-10-29 18:29
      
浏览 14610
      
评论(0)
      
      
      
分类:企业架构
      
      
查看更多