Js获取下拉框选定项的值和文本的实现代码


Posted in Javascript onFebruary 26, 2014

Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误!

下面我总结下Firefox和IE下获取下拉框选定项的值和文本:

1. IE和Firefox都支持的方法:
获取文本

var obj=document.getElementById('select_template'); 
var text=obj.options[obj.selectedIndex].text;//获取文本
 
var obj=document.getElementById("select_template");
        for(i=0;i<obj.length;i++) {//下拉框的长度就是他的选项数
           if(obj[i].selected==true) {
            var text=obj[i].text;//获取文本
        }
}

二者相比上一个方法比较简洁

2. IE支持Firefox不支持:

var obj=document.getElementById(name);
for(i=0;i<obj.length;i++)  {
        if(obj[i].selected==true) {
           var text= obj[i].innerText;     
        }
    }

获取值方法IE和Firefox通用:
var value=document.getElementById("select_template").value;//获取值

总结:其实主要就是IE和Firefox都支持value和text属性,Firefox不支持innerText属性。

Js实现当前页打开一个新链接:
window.location.href=url;

Javascript 相关文章推荐
JavaScript定义类或函数的几种方式小结
Jan 09 Javascript
jquery星级插件、支持页面中多次使用
Mar 25 Javascript
用js代码改变单选框选中状态的简单实例
Dec 18 Javascript
Node.js与PHP、Python的字符处理性能对比
Jul 06 Javascript
jquery实现两个图片渐变切换效果的方法
Jun 25 Javascript
[原创]jQuery常用的4种加载方式分析
Jul 25 Javascript
vue2.0 datepicker使用方法
Feb 04 Javascript
vue中阻止click事件冒泡,防止触发另一个事件的方法
Feb 08 Javascript
vue动画打包后失效问题的解决方法
Sep 18 Javascript
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
微信小程序基于Taro的分享图片功能实践详解
Jul 12 Javascript
Vue中强制组件重新渲染的正确方法
Jan 03 Vue.js
js自动查找select下拉的菜单并选择(示例代码)
Feb 26 #Javascript
jQuery设置与获取HTML,文本和值的简单实例
Feb 26 #Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
Feb 26 #Javascript
Javascript高级技巧分享
Feb 25 #Javascript
鼠标拖拽移动子窗体的JS实现
Feb 25 #Javascript
js判断为空Null与字符串为空简写方法
Feb 24 #Javascript
JS清空多文本框、文本域示例代码
Feb 24 #Javascript
You might like
第十二节 类的自动加载 [12]
2006/10/09 PHP
Apache+php+mysql在windows下的安装与配置图解(最新版)
2008/11/30 PHP
深入理解PHP中的global
2014/08/19 PHP
JS正则验证邮箱的格式详细介绍
2013/11/19 Javascript
基于jquery和svg实现超炫酷的动画特效
2014/12/09 Javascript
JavaScript中的Number数字类型学习笔记
2016/05/26 Javascript
jquery插件bootstrapValidator数据验证详解
2016/11/09 Javascript
boostrap模态框二次弹出清空原有内容的方法
2018/08/10 Javascript
小程序实现短信登录倒计时
2019/07/12 Javascript
vue调用语音播放的方法
2019/09/27 Javascript
p5.js临摹动态图形实现方法详解
2019/10/23 Javascript
JavaScript canvas实现跟随鼠标移动小球
2021/02/09 Javascript
[46:28]EG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第二场 8.23
2019/09/05 DOTA
搭建Python的Django框架环境并建立和运行第一个App的教程
2016/07/02 Python
python版学生管理系统
2018/01/10 Python
Python2中文处理纪要的实现方法
2018/03/10 Python
对numpy 数组和矩阵的乘法的进一步理解
2018/04/04 Python
Python代码缩进和测试模块示例详解
2018/05/07 Python
python format 格式化输出方法
2018/07/16 Python
python文件操作之批量修改文件后缀名的方法
2018/08/10 Python
pandas数据筛选和csv操作的实现方法
2019/07/02 Python
pandas通过字典生成dataframe的方法步骤
2019/07/23 Python
python中列表的切片与修改知识点总结
2019/07/23 Python
Django rstful登陆认证并检查session是否过期代码实例
2019/08/13 Python
python读取mysql数据绘制条形图
2020/03/25 Python
Django实现任意文件上传(最简单的方法)
2020/06/03 Python
Scrapy爬虫文件批量运行的实现
2020/09/30 Python
阿玛尼美国官方网站:Armani.com
2016/11/25 全球购物
神路信息Java面试题目
2013/03/31 面试题
联欢晚会主持词
2014/03/25 职场文书
社区工作者演讲稿
2014/05/23 职场文书
校园文化标语
2014/06/18 职场文书
学习作风建设心得体会
2014/10/22 职场文书
2015年司法所工作总结
2015/04/27 职场文书
导游词之无锡丝业博物馆
2019/11/12 职场文书
漫改真人电影「萌系男友是燃燃的橘色」公开先导视觉图
2022/03/21 日漫