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 相关文章推荐
File文件控件,选中文件(图片,flash,视频)即立即预览显示
Apr 09 Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
读jQuery之十三 添加事件和删除事件的核心方法
Aug 23 Javascript
在线一元二次方程计算器实例(方程计算器在线计算)
Dec 22 Javascript
js实现表单Radio切换效果的方法
Aug 17 Javascript
浅谈JS中的三种字符串连接方式及其性能比较
Sep 02 Javascript
NPM 安装cordova时警告:npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to
Dec 20 Javascript
原生js实现商品放大镜效果
Jan 12 Javascript
Vue中的混入的使用(vue mixins)
Jun 01 Javascript
node.js中ws模块创建服务端和客户端,网页WebSocket客户端
Mar 06 Javascript
解决layui动态加载复选框无法选中的问题
Sep 20 Javascript
微信小程序实现菜单左右联动
May 19 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
PHP获取网页标题的3种实现方法代码实例
2014/04/11 PHP
3款值得推荐的微信开发开源框架
2014/10/28 PHP
yii2.0实现创建简单widgets示例
2016/07/18 PHP
Yii 2中的load()和save()示例详解
2017/08/03 PHP
PHP实现QQ登录的开原理和实现过程
2018/02/04 PHP
PHP实现唤起微信支付功能
2019/02/18 PHP
PHP 代码简洁之道(小结)
2019/10/16 PHP
google地图的路线实现代码
2009/08/20 Javascript
jqeury eval将字符串转换json的方法
2011/01/20 Javascript
深入理解JavaScript系列(2) 揭秘命名函数表达式
2012/01/15 Javascript
jQuery通过ajax请求php遍历json数组到table中的代码(推荐)
2016/06/12 Javascript
javascript内存分配原理实例分析
2017/04/10 Javascript
详解ES6之用let声明变量以及let loop机制
2017/07/15 Javascript
Vue中如何实现轮播图的示例代码
2017/07/27 Javascript
jquery实现直播视频弹幕效果
2020/02/25 jQuery
动态规划之矩阵连乘问题Python实现方法
2017/11/27 Python
Python paramiko模块的使用示例
2018/04/11 Python
tensorflow实现简单的卷积神经网络
2018/05/24 Python
Python实现求两个数组交集的方法示例
2019/02/23 Python
Python datetime和unix时间戳之间相互转换的讲解
2019/04/01 Python
python远程连接MySQL数据库
2019/04/19 Python
Python中将两个或多个list合成一个list的方法小结
2019/05/12 Python
详解Django CAS 解决方案
2019/10/30 Python
python GUI库图形界面开发之PyQt5控件数据拖曳Drag与Drop详细使用方法与实例
2020/02/27 Python
关于Theano和Tensorflow多GPU使用问题
2020/06/19 Python
利用python制作拼图小游戏的全过程
2020/12/04 Python
说说你所熟悉或听说过的j2ee中的几种常用模式?及对设计模式的一些看法
2012/05/24 面试题
JAVA中的关键字有什么特点
2014/03/07 面试题
Linux如何命名文件--使用文件名时应注意
2014/05/29 面试题
爱国电影观后感
2015/06/19 职场文书
听课评课活动心得体会
2016/01/15 职场文书
《巨人的花园》教学反思
2016/02/19 职场文书
联想win10摄像头打不开怎么办?win10笔记本摄像头打不开解决办法
2022/04/08 数码科技
详解Android中的TimePickerView(时间选择器)的用法
2022/04/30 Java/Android
Redis唯一ID生成器的实现
2022/07/07 Redis
python如何利用cv2.rectangle()绘制矩形框
2022/12/24 Python