JQuery select控件的相关操作实现代码


Posted in Javascript onSeptember 14, 2012

获取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 相关文章推荐
IE中jscript/javascript的条件编译
Sep 07 Javascript
defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
Apr 27 Javascript
一行代码告别document.getElementById
Jun 01 Javascript
JS获取当前日期时间并定时刷新示例
Mar 04 Javascript
javascript面向对象之共享成员属性与方法及prototype关键字用法
Jan 13 Javascript
JS实现同时搜索百度和必应的方法
Jan 27 Javascript
详解JavaScript数组和字符串中去除重复值的方法
Mar 07 Javascript
AngularJS表单详解及示例代码
Aug 17 Javascript
Angular 通过注入 $location 获取与修改当前页面URL的实例
May 31 Javascript
ES6中Array.includes()函数的用法
Sep 20 Javascript
如何测量vue应用运行时的性能
Jun 21 Javascript
Vue实现随机验证码功能
Dec 29 Vue.js
11个用于提高排版水平的基于jquery的文字效果插件
Sep 14 #Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
Sep 14 #Javascript
推荐17个优美新鲜的jQuery的工具提示插件
Sep 14 #Javascript
Java 正则表达式学习总结和一些小例子
Sep 13 #Javascript
获取客户端电脑日期时间js代码(jquery)
Sep 12 #Javascript
IE中jquery.form中ajax提交没反应解决方法分享
Sep 11 #Javascript
jquery ajax例子返回值详解
Sep 11 #Javascript
You might like
PHP 替换模板变量实现步骤
2009/08/24 PHP
php生成不重复随机数、数组的4种方法分享
2015/03/30 PHP
thinkphp3.x中session方法的用法分析
2016/05/20 PHP
ThinkPHP 3.2.3实现页面静态化功能的方法详解
2017/08/03 PHP
取得一定长度的内容,处理中文
2006/12/20 Javascript
jQuery Ajax异步处理Json数据详解
2013/11/05 Javascript
Mac/Windows下如何安装Node.js
2013/11/22 Javascript
jquery中push()的用法(数组添加元素)
2014/11/25 Javascript
如何编写高质量JS代码
2014/12/28 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
jQuery解析json格式数据简单实例
2016/01/22 Javascript
文件上传的几个示例分享【推荐】
2016/12/16 Javascript
BootStrapValidator校验方式
2016/12/19 Javascript
vue.js的手脚架vue-cli项目搭建的步骤
2017/08/30 Javascript
微信小程序实现循环动画效果
2018/07/16 Javascript
详解redux异步操作实践
2018/08/15 Javascript
微信小程序中显示倒计时代码实例
2019/05/09 Javascript
小程序如何自主实现拦截器的示例代码
2019/11/04 Javascript
[37:22]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第一局
2016/02/28 DOTA
python基础教程之序列详解
2014/08/29 Python
Python实现list反转实例汇总
2014/11/11 Python
详细介绍Python函数中的默认参数
2015/03/30 Python
Python eval的常见错误封装及利用原理详解
2019/03/26 Python
Python 使用threading+Queue实现线程池示例
2019/12/21 Python
Python爬虫模拟登陆哔哩哔哩(bilibili)并突破点选验证码功能
2020/12/21 Python
在Pycharm中安装Pandas库方法(简单易懂)
2021/02/20 Python
HTML5 embed 标签使用方法介绍
2013/08/13 HTML / CSS
英语硕士生求职简历的自我评价
2013/10/15 职场文书
毕业生自荐书模版
2014/01/04 职场文书
2014年教师节演讲稿范文
2014/09/10 职场文书
公司租房协议书范本
2014/10/08 职场文书
协议书范文
2015/01/27 职场文书
2015教师年度考核评语
2015/03/25 职场文书
2015年小学教导处工作总结
2015/05/26 职场文书
网络妈妈观后感
2015/06/08 职场文书
党纪处分决定书
2015/06/24 职场文书