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 相关文章推荐
ASP小贴士/ASP Tips javascript tips可以当桌面
Dec 10 Javascript
基于jquery的cookie的用法
Jan 10 Javascript
40个有创意的jQuery图片和内容滑动及弹出插件收藏集之三
Jan 03 Javascript
JS操作数据库的实例代码
Oct 17 Javascript
关于删除时的提示处理(确定删除吗)
Nov 03 Javascript
基于jQuery实现仿淘宝套餐选择插件
Mar 04 Javascript
jQuery实现form表单元素序列化为json对象的方法
Dec 09 Javascript
js获取指定字符前/后的字符串简单实例
Oct 27 Javascript
微信开发 js实现tabs选项卡效果
Oct 28 Javascript
jQuery zTree插件使用简单教程
Aug 16 jQuery
javascript如何实现create方法
Nov 04 Javascript
如何在JS文件中获取Vue组件
Sep 16 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
php处理restful请求的路由类分享
2014/02/27 PHP
php数组查找函数in_array()、array_search()、array_key_exists()使用实例
2014/04/29 PHP
Yii2.0建立公共方法简单示例
2019/01/29 PHP
PHP convert_cyr_string()函数讲解
2019/02/13 PHP
解析Javascript中难以理解的11个问题
2013/12/09 Javascript
js判断为空Null与字符串为空简写方法
2014/02/24 Javascript
动态显示可输入的字数提示还可以输入的字数
2014/04/01 Javascript
JavaScript中number转换成string介绍
2014/12/31 Javascript
javascript 应用小技巧方法汇总
2015/07/05 Javascript
JS实现鼠标滑过链接改变网页背景颜色的方法
2015/10/20 Javascript
vue-cli中安装方法(图文详细步骤)
2018/12/12 Javascript
记一次用vue做的活动页的方法步骤
2019/04/11 Javascript
nodejs检测因特网是否断开的解决方案
2019/04/17 NodeJs
基于nodejs的微信JS-SDK简单应用实现
2019/05/21 NodeJs
简单谈谈javascript高级特性
2019/09/04 Javascript
Ant Design moment对象和字符串之间的相互转化教程
2020/10/27 Javascript
Nest.js 授权验证的方法示例
2021/02/22 Javascript
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
python调用shell的方法
2013/11/20 Python
Python获取电脑硬件信息及状态的实现方法
2014/08/29 Python
Python实现查找系统盘中需要找的字符
2015/07/14 Python
Python 正则表达式入门(初级篇)
2016/12/07 Python
用Python shell简化开发
2018/08/08 Python
使用python 计算百分位数实现数据分箱代码
2020/03/03 Python
使用css实现android系统的loading加载动画
2019/07/25 HTML / CSS
瑞典廉价机票预订网站:Seat24
2018/06/19 全球购物
房地产项目策划书
2014/02/05 职场文书
敬老院活动总结
2014/04/28 职场文书
个人求职信范文
2014/05/24 职场文书
过程装备与控制工程专业求职信
2014/07/02 职场文书
呼兰河传读书笔记
2015/06/30 职场文书
2015大一新生军训感言
2015/08/01 职场文书
2016年党员公开承诺书范文
2016/03/24 职场文书
面试分析分布式架构Redis热点key大Value解决方案
2022/03/13 Redis
Spring Data JPA框架的核心概念和Repository接口
2022/04/28 Java/Android
深入理解MySQL中MVCC与BufferPool缓存机制
2022/05/25 MySQL