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 相关文章推荐
js中array的sort()方法使用介绍
Feb 20 Javascript
Seajs的学习笔记
Mar 04 Javascript
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
Jul 06 Javascript
jQuery中复合属性选择器用法实例
Dec 31 Javascript
jQuery实现锚点scoll效果实例分析
Mar 10 Javascript
javascript动态创建表格及添加数据实例详解
May 13 Javascript
在JavaScript中使用开平方根的sqrt()方法
Jun 15 Javascript
DropDownList实现可输入可选择(两种版本可选)
Dec 07 Javascript
Vue.js 2.0中select级联下拉框实例
Mar 06 Javascript
vue 列表页跳转详情页获取id以及详情页通过id获取数据
Mar 27 Javascript
巧妙运用v-model实现父子组件传值的方法示例
Apr 07 Javascript
JQuery样式与属性设置方法分析
Dec 07 jQuery
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
PHP个人网站架设连环讲(一)
2006/10/09 PHP
PHP 工厂模式使用方法
2010/05/18 PHP
PHP中集成PayPal标准支付的实现方法分享
2012/02/06 PHP
php源码之将图片转化为data/base64数据流实例详解
2016/11/27 PHP
php中static和const关键字用法分析
2016/12/07 PHP
CL vs ForZe BO5 第五场 2.13
2021/03/10 DOTA
简单的JS多重继承示例
2008/03/13 Javascript
如何让DIV可编辑、可拖动示例代码
2013/09/18 Javascript
9个让JavaScript调试更简单的Console命令
2016/11/14 Javascript
js实现增加数字显示的环形进度条效果
2017/02/05 Javascript
深入理解Vue 的条件渲染和列表渲染
2017/09/01 Javascript
Vuejs实现购物车功能
2017/11/05 Javascript
WebSocket的通信过程与实现方法详解
2018/04/29 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
2018/05/16 Javascript
详解angular如何调用HTML字符串的方法
2018/06/30 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
2018/08/22 Javascript
微信小程序 腾讯地图显示偏差问题解决
2019/07/27 Javascript
js加减乘除精确运算方法实例代码
2021/01/17 Javascript
[03:12]TI9战队档案 - Virtus Pro
2019/08/20 DOTA
Python的lambda匿名函数的简单介绍
2013/04/25 Python
python通过ftplib登录到ftp服务器的方法
2015/05/08 Python
Python批量重命名同一文件夹下文件的方法
2015/05/25 Python
深入学习Python中的装饰器使用
2016/06/20 Python
python远程邮件控制电脑升级版
2019/05/23 Python
Python 分享10个PyCharm技巧
2019/07/13 Python
捷克汽车配件和工具销售网站:TorriaCars
2018/02/26 全球购物
财务会计实习报告体会
2013/12/20 职场文书
传承焦裕禄精神思想汇报2014
2014/09/10 职场文书
实习单位意见
2015/06/04 职场文书
培训班开班主持词
2015/07/02 职场文书
欢迎新生标语2015
2015/07/16 职场文书
简短清晨问候语
2015/11/10 职场文书
Python实现随机生成迷宫并自动寻路
2021/06/13 Python
Apache Hudi集成Spark SQL操作hide表
2022/03/31 Servers
win10+RTX3050ti+TensorFlow+cudn+cudnn配置深度学习环境的方法
2022/06/25 Servers
码云(gitee)通过git自动同步到阿里云服务器
2022/12/24 Servers