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 相关文章推荐
实例:用 JavaScript 来操作字符串(一些字符串函数)
Feb 15 Javascript
Javascript 复制数组实现代码
Nov 26 Javascript
深入分析JQuery和JavaScript的异同
Oct 23 Javascript
js实现DOM走马灯特效的方法
Jan 21 Javascript
jquery拖拽效果完整实例(附demo源码下载)
Jan 14 Javascript
jQuery筛选数组之grep、each、inArray、map的用法及遍历json对象
Jun 20 Javascript
vue实现单选和多选功能
Aug 11 Javascript
Mongoose实现虚拟字段查询的方法详解
Aug 15 Javascript
vue2.0 实现导航守卫的具体用法(路由守卫)
May 17 Javascript
javascript实现文本框标签验证的实例代码
Oct 14 Javascript
浅谈JavaScript闭包
Apr 09 Javascript
es6函数之箭头函数用法实例详解
Apr 25 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使用curl和正则表达式抓取网页数据示例
2014/04/13 PHP
Session 失效的原因汇总及解决丢失办法
2015/09/30 PHP
php使用fullcalendar日历插件详解
2019/03/06 PHP
Jquery 弹出层插件实现代码
2009/10/24 Javascript
DOM基础教程之事件对象
2015/01/20 Javascript
JavaScript实现图片DIV竖向滑动的方法
2015/04/25 Javascript
JavaScript操作Cookie方法实例分析
2015/05/27 Javascript
分享经典的JavaScript开发技巧
2015/11/21 Javascript
Select下拉框模糊查询功能实现代码
2016/07/22 Javascript
javascript中的后退和刷新实现方法
2016/11/10 Javascript
Javascript中的prototype与继承
2017/02/06 Javascript
js仿淘宝商品放大预览功能
2017/03/15 Javascript
ionic+AngularJs实现获取验证码倒计时按钮
2017/04/22 Javascript
JavaScript中Object值合并方法详解
2017/12/22 Javascript
jQuery实现form表单序列化转换为json对象功能示例
2018/05/23 jQuery
vue中进入详情页记住滚动位置的方法(keep-alive)
2018/09/21 Javascript
vue安装和使用scss及sass与scss的区别详解
2018/10/15 Javascript
详解基于Vue,Nginx的前后端不分离部署教程
2018/12/04 Javascript
图文讲解用vue-cli脚手架创建vue项目步骤
2019/02/12 Javascript
Vue动态加载图片在跨域时无法显示的问题及解决方法
2020/03/10 Javascript
Vue实现导航栏菜单
2020/08/19 Javascript
在antd中setFieldsValue和defaultVal的用法
2020/10/29 Javascript
举例讲解Python中的身份运算符的使用方法
2015/10/13 Python
利用Python2下载单张图片与爬取网页图片实例代码
2017/12/25 Python
python测试mysql写入性能完整实例
2018/01/18 Python
python实现简易版计算器
2020/06/22 Python
解决python3中解压zip文件是文件名乱码的问题
2018/03/22 Python
python如何求数组连续最大和的示例代码
2020/02/04 Python
html5小技巧之通过document.head获取head元素
2014/06/04 HTML / CSS
倩碧英国官网:Clinique英国
2018/08/10 全球购物
康拓普公司Java笔面试
2016/09/23 面试题
求职信需要的五点内容
2014/02/01 职场文书
军训 自我鉴定
2014/02/03 职场文书
2014年会策划方案
2014/05/11 职场文书
2014年小学语文工作总结
2014/12/20 职场文书
python函数的两种嵌套方法使用
2022/04/02 Python