JS获取select的value和text值的简单实例


Posted in Javascript onFebruary 26, 2014
<select id = "cityList" >   
<select id = "selectId" >   
   <option value = "0">第0个</option>   
</select>   <script>   
    var selectObj = document.getElementById('selectId');   
    // 通过对象添加option   
    selectId.add(new Option("第一个","1"))   
    selectId.add(new Option("第二个","2"))   
    // 通过id添加option   
    selectId.add(new Option("第三个","3"))   
    selectId.add(new Option("第四个","4"))   
    // 通过id添加方法(也可以通过对象添加方法)   
    selectId.onchange = function(){   
        // 通过对象获取value和text   
        alert(selectObj.value);   
        alert(selectObj.options[selectObj.selectedIndex].text);   
        // 通过 id 获取value和text   
        alert(selectId.value);   
        alert(selectId.options[selectId.selectedIndex].text);   
        // 还可以通过this获取value和text   
        alert(this.value);   
        alert(this.options[this.selectedIndex].text);   
    };   
</script> 
Javascript 相关文章推荐
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
Jun 28 Javascript
javascript不同类型数据之间的运算的转换方法
Feb 13 Javascript
教你用AngularJS框架一行JS代码实现控件验证效果
Jun 23 Javascript
jQuery中innerWidth()方法用法实例
Jan 19 Javascript
javascript设置页面背景色及背景图片的方法
Dec 29 Javascript
js调用webservice构造SOAP进行身份验证
Apr 27 Javascript
Angular2中如何使用ngx-translate进行国际化
May 21 Javascript
详解JS中的柯里化(currying)
Aug 17 Javascript
ES6基础之解构赋值(destructuring assignment)
Feb 21 Javascript
原生js实现可兼容PC和移动端的拖动滑块功能详解【测试可用】
Aug 15 Javascript
vue 查看dist文件里的结构(多种方式)
Jan 17 Javascript
es6中new.target的作用和使用场景简单示例分析
Mar 14 Javascript
JS获取文本框,下拉框,单选框的值的简单实例
Feb 26 #Javascript
Js获取下拉框选定项的值和文本的实现代码
Feb 26 #Javascript
js自动查找select下拉的菜单并选择(示例代码)
Feb 26 #Javascript
jQuery设置与获取HTML,文本和值的简单实例
Feb 26 #Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
Feb 26 #Javascript
Javascript高级技巧分享
Feb 25 #Javascript
鼠标拖拽移动子窗体的JS实现
Feb 25 #Javascript
You might like
PHP控制网页过期时间的代码
2008/09/28 PHP
『PHP』PHP截断函数mb_substr()使用介绍
2013/04/22 PHP
在Nginx上部署ThinkPHP项目教程
2015/02/02 PHP
PHP入门教程之字符串处理技巧总结(转换,过滤,解析,查找,截取,替换等)
2016/09/11 PHP
PHPstorm快捷键(分享)
2017/07/17 PHP
PHP基于IMAP收取邮件的方法示例
2017/08/07 PHP
thinkphp5使用无限极分类
2019/02/18 PHP
JS类库Bindows1.3中的内存释放方式分析
2007/03/08 Javascript
document.open() 与 document.write()的区别
2007/08/13 Javascript
22点关于jquery性能优化的建议
2014/05/28 Javascript
浅谈javascript中字符串String与数组Array
2014/12/31 Javascript
z-blog SyntaxHighlighter 长代码无法换行解决办法(基于jquery)
2015/11/18 Javascript
nodejs获取微信小程序带参数二维码实现代码
2017/04/12 NodeJs
jquery实现楼层滚动效果
2018/01/01 jQuery
详解vue+axios给开发环境和生产环境配置不同的接口地址
2019/08/16 Javascript
JavaScript This指向问题详解
2019/11/25 Javascript
JS面向对象之多选框实现
2020/01/17 Javascript
使用 Opentype.js 生成字体子集的实例代码详解
2020/05/25 Javascript
解决vue 给window添加和移除resize事件遇到的坑
2020/07/21 Javascript
Vue实现计算器计算效果
2020/08/17 Javascript
js实现头像上传并且可预览提交
2020/12/25 Javascript
[01:00:10]完美世界DOTA2联赛PWL S2 FTD vs Inki 第二场 11.21
2020/11/24 DOTA
python使用reportlab实现图片转换成pdf的方法
2015/05/22 Python
详解Python实现按任意键继续/退出的功能
2016/08/19 Python
简单谈谈Python中的元祖(Tuple)和字典(Dict)
2017/04/21 Python
python中类的属性和方法介绍
2018/11/27 Python
Python从list类型、range()序列简单认识类(class)【可迭代】
2019/05/31 Python
python ChainMap的使用和说明详解
2019/06/11 Python
python3正则模块re的使用方法详解
2020/02/11 Python
欧洲有机婴儿食品最大的市场:Organic Baby Food(供美国和加拿大)
2018/03/28 全球购物
设置器与访问器的定义以及各自特点
2016/01/08 面试题
小学爱国卫生月活动总结
2014/06/30 职场文书
特此通知格式
2015/04/27 职场文书
学雷锋感言
2015/08/03 职场文书
汽车销售员工作总结
2015/08/12 职场文书
Element实现动态表格的示例代码
2021/08/02 Javascript