js获取下拉列表框中的value和text的值示例代码


Posted in Javascript onJanuary 11, 2014

在编程过程中,我们对下拉列表框的取值很多时候都是获取option中的value,但是也有需要获取显示在页面中的值的时候,例如想获得<option value="value">ShowText</option>中"ShowText",我们该如何获取呢?方法很简单,具体代码如下:

<script type="text/javascript">
function a(object){
alert(object);
}
</script>
<!-- 获取显示的值 -->
<select onchange="a(this.options[this.selectedIndex].innerText);">
<option value="value-a">text-a</option>
<option value="value-b">text-b</option>
</select>
<!-- 获取value的值 -->
<select onchange="a(this.options[this.selectedIndex].value);">
<option value="value-c">text-c</option>
<option value="value-d">text-d</option>
</select>
function isSelect(selectPress) {
            //var select = document.getElementById("mySelect").ind;
            var selectValue = selectPress.options[selectPress.selectedIndex].value; //显示value 下标0、1、2
            var selectValue2 = selectPress.options[selectPress.selectedIndex].innerText; //显示显示的值 具体内容(上海、北京)
            //alert(selectValue);
            //alert(selectValue2);
            if (selectValue == "-1") {
                alert("请选择城市,表单提交被拒绝!")
                return;
            }
            else {
                document.getElementById('form1').submit(); //form表单提交
            }
        } 
<select onchange="isSelect(this);" id="mySelect">
        <option value="-1">--请选择--</option>
        <option value="0">北京</option>
        <option value="1">上海</option>
        <option value="2">武汉</option>
</select>
Javascript 相关文章推荐
javascript parseInt 函数分析(转)
Mar 21 Javascript
JQuery 学习笔记 选择器之一
Jul 23 Javascript
JavaScript Event学习第二章 Event浏览器兼容性
Feb 07 Javascript
浅析tr的隐藏和显示问题
Mar 05 Javascript
javascript使用正则控制input输入框允许输入的值方法大全
Jun 19 Javascript
浅谈JavaScript Date日期和时间对象
Dec 29 Javascript
基于jQuery实现带动画效果超炫酷的弹出对话框(附源码下载)
Feb 22 Javascript
Angular2 路由问题修复详解
Mar 01 Javascript
JavaScript数据结构之数组的表示方法示例
Apr 12 Javascript
微信小程序利用co处理异步流程的方法教程
May 20 Javascript
jQuery实现动态添加和删除input框实例代码
Mar 26 jQuery
javascript跳转与返回和刷新页面的实例代码
Nov 20 Javascript
两个select多选模式的选项相互移动(示例代码)
Jan 11 #Javascript
利用javascript打开模态对话框(示例代码)
Jan 11 #Javascript
showModalDialog模态对话框的使用详解以及浏览器兼容
Jan 11 #Javascript
JS对话框_JS模态对话框showModalDialog用法总结
Jan 11 #Javascript
Javascript自定义函数判断网站访问类型是PC还是移动终端
Jan 10 #Javascript
兼容主流浏览器的iframe自适应高度js脚本
Jan 10 #Javascript
javascript遍历控件实例详细解析
Jan 10 #Javascript
You might like
冰滴咖啡制作步骤
2021/03/03 冲泡冲煮
NOT NULL 和NULL
2007/01/15 PHP
mysql limit查询优化分析
2008/11/12 PHP
php笔记之:数据类型与常量的使用分析
2013/05/14 PHP
PHP实现图片压缩的两则实例
2014/07/19 PHP
简单分析ucenter 会员同步登录通信原理
2014/08/25 PHP
php获取随机数组列表的方法
2014/11/13 PHP
JavaScript iframe的相互操作浅析
2009/10/14 Javascript
js 格式化时间日期函数小结
2010/03/20 Javascript
JS对象转换为Jquery对象示例
2014/01/26 Javascript
php的文件上传入门教程(实例讲解)
2014/04/10 Javascript
SpringMVC框架下JQuery传递并解析Json格式的数据是如何实现的
2015/12/10 Javascript
Bootstrap树形控件使用方法详解
2016/01/27 Javascript
全面理解JavaScript中的继承(必看)
2016/06/16 Javascript
浅谈JS正则表达式的RegExp对象和括号的使用
2016/07/28 Javascript
Google 地图控件集详解及实例代码
2016/08/06 Javascript
JavaScript中获取时间的函数集
2016/08/16 Javascript
JavaScript实现清空(重置)文件类型INPUT元素值的方法
2016/11/17 Javascript
Vue开发中整合axios的文件整理
2017/04/29 Javascript
利用Vue实现移动端图片轮播组件的方法实例
2017/08/23 Javascript
es6学习之解构时应该注意的点
2017/08/29 Javascript
jqgrid实现简单的单行编辑功能
2017/09/30 Javascript
[36:52]DOTA2真视界:基辅特锦赛总决赛
2017/05/21 DOTA
Python 开发Activex组件方法
2009/11/08 Python
Python中functools模块函数解析
2017/03/12 Python
python是否适合网页编程详解
2019/10/04 Python
Python3.8安装Pygame教程步骤详解
2020/08/14 Python
波兰最大的宠物用品网上商店:FERA.PL
2019/08/11 全球购物
高校群众路线教育实践活动剖析材料
2014/10/10 职场文书
个人年底工作总结
2015/03/10 职场文书
2015年乡镇纪检工作总结
2015/04/22 职场文书
医院合作意向书范本
2015/05/08 职场文书
情况说明书格式及范文
2019/06/24 职场文书
奖学金申请书(范文)
2019/08/14 职场文书
班干部竞选演讲稿(精选5篇)
2019/09/24 职场文书
理解python中装饰器的作用
2021/07/21 Python