日期:2014-05-16  浏览次数:20416 次

使用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对象获取当前下拉框的节点元素,由于节点的值并非只有一个,所以我们可以通过循环节点来得到每