jquery下拉select控件操作方法分享(jquery操作select)


Posted in Javascript onMarch 25, 2014

JQuery获取和设置Select选项方法汇总如下:

代码:

$("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发
var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
var checkValue=$("#select_id").val();  //获取Select选择的Value
var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值 
$("#select_id ").get(0).selectedIndex=1;  //设置Select索引值为1的项选中
$("#select_id ").val(4);   //设置Select的Value值为4的项选中
$("#select_id option[text='jQuery']").attr("selected", true);   //设置Select的Text值为jQuery的项选中

获取select 选中的 text :

$("#ddlRegType").find("option:selected").text();

获取select选中的 value:

$("#nowamagic").val();

获取select选中的索引:

$("#nowamagic").get(0).selectedIndex;

设置select

jQuery添加/删除Select的Option项:

$("#select_id").append("<option value='Value'>Text</option>");  //为Select追加一个Option(下拉项)
$("#select_id").prepend("<option value='0'>请选择</option>");  //为Select插入一个Option(第一个位置)
$("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
$("#select_id option[index='0']").remove();  //删除Select中索引值为0的Option(第一个)
$("#select_id option[value='3']").remove();  //删除Select中Value='3'的Option
$("#select_id option[text='4']").remove();  //删除Select中Text='4'的Option

设置select 选中的索引:

//index为索引值
$("#nowamagic").get(0).selectedIndex=index;

设置select 选中的value:

$("#nowamagic").attr("value","Normal");
$("#nowamagic").val("Normal");
$("#nowamagic").get(0).value = value;

设置select 选中的text:

var count=$("#nowamagicoption").length;
  for(var i=0;i<count;i++)  
     {           if($("#nowamagic").get(0).options[i].text == text)  
        {  
            $("#nowamagic").get(0).options[i].selected = true;              break;  
        }  
    }

清空 select:

$("#nowamagic").empty();
Javascript 相关文章推荐
jquery刷新页面的实现代码(局部及全页面刷新)
Jul 11 Javascript
js用Date对象处理时间实现思路及代码
Jan 31 Javascript
jquery 倒计时效果实现秒杀思路
Sep 11 Javascript
js中直接声明一个对象的方法
Aug 10 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
Mar 26 Javascript
JavaScript获得表单target属性的方法
Apr 02 Javascript
JavaScript获取并更改input标签name属性的方法
Jul 02 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
Aug 21 Javascript
jQuery遮罩层实现方法实例详解(附遮罩层插件)
Dec 08 Javascript
原生JS实现自定义滚动条效果
Oct 27 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
Aug 12 Javascript
js中复选框的取值及赋值示例详解
Oct 18 Javascript
jquery的each方法使用示例分享
Mar 25 #Javascript
提取jquery的ready()方法单独使用示例
Mar 25 #Javascript
jquery跨域请求示例分享(jquery发送ajax请求)
Mar 25 #Javascript
jquery解析xml字符串示例分享
Mar 25 #Javascript
jquery数组封装使用方法分享(jquery数组遍历)
Mar 25 #Javascript
jquery选择器原理介绍($()使用方法)
Mar 25 #Javascript
Jquery插件编写简明教程
Mar 25 #Javascript
You might like
javascript入门·对象属性方法大总结
2007/10/01 Javascript
js+css在交互上的应用
2010/07/18 Javascript
javascript学习笔记(十三) js闭包介绍(转)
2012/06/20 Javascript
jQuery中的jQuery()方法用法分析
2014/12/27 Javascript
javascript返回顶部的按钮实现方法
2016/01/09 Javascript
深入解析Backbone.js框架的依赖库Underscore.js的作用
2016/05/07 Javascript
Javascript自执行匿名函数(function() { })()的原理浅析
2016/05/15 Javascript
JavaScript实战之带收放动画效果的导航菜单
2016/08/16 Javascript
javascript编写简易计算器
2017/05/06 Javascript
用js屏蔽被http劫持的浮动广告实现方法
2017/08/10 Javascript
微信小程序实现动态设置页面标题的方法【附源码下载】
2017/11/29 Javascript
p5.js入门教程之小球动画示例代码
2018/03/15 Javascript
使用Angular CLI进行Build(构建)和Serve详解
2018/03/24 Javascript
JavaScript的词法结构精华篇
2018/10/17 Javascript
使用Vue生成动态表单
2019/11/26 Javascript
详解ECMAScript2019/ES10新属性
2019/12/06 Javascript
详解小程序BackgroundAudioManager踩坑之旅
2019/12/08 Javascript
基于小程序请求接口wx.request封装的类axios请求
2020/07/02 Javascript
详解nginx配置vue h5 history去除#号
2020/11/09 Javascript
python中dir函数用法分析
2015/04/17 Python
python去除文件中空格、Tab及回车的方法
2016/04/12 Python
python实现K最近邻算法
2018/01/29 Python
Python+OpenCV实现车牌字符分割和识别
2018/03/31 Python
django表单实现下拉框的示例讲解
2018/05/29 Python
python实现将读入的多维list转为一维list的方法
2018/06/28 Python
Python文字截图识别OCR工具实例解析
2020/03/05 Python
python跨文件使用全局变量的实现
2020/11/17 Python
Django数据统计功能count()的使用
2020/11/30 Python
关于HTML5语义标签的实践(blog页面)
2016/07/12 HTML / CSS
全球才华横溢工匠的家居装饰、珠宝和礼物:NOVICA
2021/01/22 全球购物
打架检讨书100字
2014/01/19 职场文书
数学与统计学院学生个人职业生涯规划书
2014/02/10 职场文书
父母寄语大全
2014/04/12 职场文书
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
运动会加油稿50字
2015/07/21 职场文书
研讨会致辞
2015/07/31 职场文书