需要将用户点击下拉列表当中某个选项后
将其所选的内容保存起来
下面与大家分享下如何使用js获取下拉列表框文本值
由此需求的朋友可以参考下
近日碰到一个问题就是需要将用户点击下拉列表当中某个选项后将其所选的内容保存起来例如下面的HTML代码
复制代码 代码如下:
<select onchange="isSelected(this
value);" id="city">
<option value="
">北京</option>
<option value="
" >上海</option>
<option value="
" >广州</option>
</select>
也就是说当用户选择“上海”这一列时需要将“上海”这个名称保存起来其实方法很简单看下面javascript代码
复制代码 代码如下:
function isSelected(value) {
var cityName;
var city = document
getElementById("city");
//获取选中的城市名称
for(i=
;i<city
length;i++){
if(city[i]
selected==true){
cityName = city[i]
innerText; //关键点
alert("cityName:" + cityName);
}
}
也可以这么做
复制代码 代码如下:
function isSelected(value) {
var city = document
getElementById("city");
alert(city
options[city
selectedIndex]
innerText);
}
大致解释一下首先在HTML页面上有一个下拉框并为此下拉框定了一个“city”的id并为其绑定了一个onchange事件通过此事件调用javascript函数
在 javascript函数当中通过domcument对象获取当前下拉框的节点元素由于节点的值并非只有一个所以我们可以通过循环节点来得到每个选 项的值在循环的时候通过判断当前选项是否选中如果选中则使用city[i]innerText 方式获取当前所选中的文本值当然如果需要获取选项值只需如此即可city[i]value
至此通过以上方法在IE下已能达到所要的结果但是在FIREFOX下测试时发现此法不起作用最后通过查阅资料发现另外一个方法将city[i]innerText 改为 city[i]text即可这种方法对IE及FIXEFOX都适用！
