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 相关文章推荐
Ext 今日学习总结
Sep 19 Javascript
学习面向对象之面向对象的基本概念:对象和其他基本要素
Nov 30 Javascript
JS 面向对象之神奇的prototype
Feb 26 Javascript
js中单引号与双引号冲突问题解决方法
Oct 04 Javascript
写出高效jquery代码的19条指南
Mar 19 Javascript
JQuery 图片滚动轮播示例代码
Mar 24 Javascript
js实现将选中值累加到文本框的方法
Aug 12 Javascript
prototype与__proto__区别详细介绍
Jan 09 Javascript
在node中如何使用 ES6
Apr 22 Javascript
iscroll.js滚动加载实例详解
Jul 18 Javascript
vue实现分页组件
Jun 16 Javascript
vue点击弹窗自动触发点击事件的解决办法(模拟场景)
May 25 Vue.js
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可变长参数处理函数详解
2017/02/22 PHP
Yii 访问 Gii(脚手架)时出现 403 错误
2018/06/06 PHP
一个对于Array的简单扩展
2006/10/03 Javascript
优化 JavaScript 代码的方法小结
2009/07/16 Javascript
jquery 学习之二 属性相关
2010/11/23 Javascript
web前端开发也需要日志
2010/12/09 Javascript
Ext JS添加子组件的误区探讨
2013/06/28 Javascript
JS工作中的小贴士之”闭包“与事件委托的”阻止冒泡“
2016/06/16 Javascript
d3.js中冷门却实用的内置函数总结
2017/02/04 Javascript
详解webpack解惑:require的五种用法
2017/06/09 Javascript
vue和webpack项目构建过程常用的npm命令详解
2018/06/15 Javascript
JavaScript的Object.defineProperty详解
2018/07/09 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
基于redis的小程序登录实现方法流程分析
2020/05/25 Javascript
vue实现前端分页完整代码
2020/06/17 Javascript
vscode中Vue别名路径提示的实现
2020/07/31 Javascript
微信小程序实现购物车小功能
2020/12/30 Javascript
[01:47]2018年度DOTA2最佳教练-完美盛典
2018/12/16 DOTA
python重试装饰器示例
2014/02/11 Python
python执行系统命令后获取返回值的几种方式集合
2018/05/12 Python
Caffe均值文件mean.binaryproto转mean.npy的方法
2018/07/09 Python
python opencv实现图像边缘检测
2019/04/29 Python
python实现桌面气泡提示功能
2019/07/29 Python
Python 如何提高元组的可读性
2019/08/26 Python
Python中 Global和Nonlocal的用法详解
2020/01/20 Python
Python安装whl文件过程图解
2020/02/18 Python
利用 PyCharm 实现本地代码和远端的实时同步功能
2020/03/23 Python
django之导入并执行自定义的函数模块图解
2020/04/01 Python
Agoda.com官方网站:便宜预订全球酒店,高达80%的折扣
2018/04/04 全球购物
期终自我鉴定
2014/02/17 职场文书
工程管理英文求职信
2014/03/18 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
中秋节慰问信
2015/02/15 职场文书
办公室主任个人总结
2015/02/28 职场文书
简单介绍 http请求响应参数、无连接无状态、MIME、状态码、端口、telnet、curl
2021/03/31 HTML / CSS
react国际化react-intl的使用
2021/05/06 Javascript