jQuery select控制插件


Posted in Javascript onAugust 17, 2009

和大家分享一下代码:
JavaScript代码

//得到select项的个数 
jQuery.fn.size = function() 
{ 
return jQuery(this).get(0).options.length; 
} 
//获得选中项的索引 
jQuery.fn.getSelectedIndex = function() 
{ 
return jQuery(this).get(0).selectedIndex; 
} 
//获得当前选中项的文本 
jQuery.fn.getSelectedText = function() 
{ 
if(this.size() == 0) 
{ 
return "下拉框中无选项"; 
} 
else 
{ 
var index = this.getSelectedIndex(); 
return jQuery(this).get(0).options[index].text; 
} 
} 
//获得当前选中项的值 
jQuery.fn.getSelectedValue = function() 
{ 
if(this.size() == 0) 
{ 
return "下拉框中无选中值"; 
} 
else 
{ 
return jQuery(this).val(); 
} 
} 
//设置select中值为value的项为选中 
jQuery.fn.setSelectedValue = function(value) 
{ 
jQuery(this).get(0).value = value; 
} 
//设置select中文本为text的第一项被选中 
jQuery.fn.setSelectedText = function(text) 
{ 
var isExist = false; 
var count = this.size(); 
for(var i=0;i<count;i++) 
{ 
if(jQuery(this).get(0).options[i].text == text) 
{ 
jQuery(this).get(0).options[i].selected = true; 
isExist = true; 
break; 
} 
} 
if(!isExist) 
{ 
alert("下拉框中不存在该项"); 
} 
} 
//设置选中指定索引项 
jQuery.fn.setSelectedIndex = function(index) 
{ 
var count = this.size(); 
if(index >= count || index < 0) 
{ 
alert("选中项索引超出范围"); 
} 
else 
{ 
jQuery(this).get(0).selectedIndex = index; 
} 
} 
//判断select项中是否存在值为value的项 
jQuery.fn.isExistItem = function(value) 
{ 
var isExist = false; 
var count = this.size(); 
for(var i=0;i<count;i++) 
{ 
if(jQuery(this).get(0).options[i].value == value) 
{ 
isExist = true; 
break; 
} 
} 
return isExist; 
} 
//向select中添加一项,显示内容为text,值为value,如果该项值已存在,则提示 
jQuery.fn.addOption = function(text,value) 
{ 
if(this.isExistItem(value)) 
{ 
alert("待添加项的值已存在"); 
} 
else 
{ 
jQuery(this).get(0).options.add(new Option(text,value)); 
} 
} 
//删除select中值为value的项,如果该项不存在,则提示 
jQuery.fn.removeItem = function(value) 
{ 
if(this.isExistItem(value)) 
{ 
var count = this.size(); 
for(var i=0;i<count;i++) 
{ 
if(jQuery(this).get(0).options[i].value == value) 
{ 
jQuery(this).get(0).remove(i); 
break; 
} 
} 
} 
else 
{ 
alert("待删除的项不存在!"); 
} 
} 
//删除select中指定索引的项 
jQuery.fn.removeIndex = function(index) 
{ 
var count = this.size(); 
if(index >= count || index < 0) 
{ 
alert("待删除项索引超出范围"); 
} 
else 
{ 
jQuery(this).get(0).remove(index); 
} 
} 
//删除select中选定的项 
jQuery.fn.removeSelected = function() 
{ 
var index = this.getSelectedIndex(); 
this.removeIndex(index); 
} 
//清除select中的所有项 
jQuery.fn.clearAll = function() 
{ 
jQuery(this).get(0).options.length = 0; 
}

使用的时候先引入jquery.js文件,再引入jquery.liu.select.js文件,然后就可调用该插件的方法。比如,我要清除id为selEmail的下拉框中的所有项,那么我就可以这么操作:$("#selEmail").clearAll();
说明:该插件中的方法在ie7和firefox中验证通过,有错误和需要改进的地方还希望大家批评指正。
Javascript 相关文章推荐
jQuery中:last-child选择器用法实例
Dec 31 Javascript
js获取域名的方法
Jan 27 Javascript
Node.js操作Firebird数据库教程
Mar 04 Javascript
Bootstrap CSS布局之表格
Dec 17 Javascript
canvas知识总结
Jan 25 Javascript
详解使用grunt完成requirejs的合并压缩和js文件的版本控制
Mar 02 Javascript
浅谈Vue组件及组件的注册方法
Aug 24 Javascript
ng-events类似ionic中Events的angular全局事件
Sep 05 Javascript
vue.js中导出Excel表格的案例分析
Jun 11 Javascript
js实现中文实时时钟
Jan 15 Javascript
vue实现学生信息管理系统
May 30 Javascript
详解JavaScript 作用域
Jul 14 Javascript
javascript 无提示关闭窗口脚本
Aug 17 #Javascript
javascript addBookmark 加入收藏 多浏览器兼容
Aug 15 #Javascript
用JavaScript将从数据库中读取出来的日期型格式化为想要的类型。
Aug 15 #Javascript
javascript 客户端验证上传图片的大小(兼容IE和火狐)
Aug 15 #Javascript
js中的window.open返回object的错误的解决方法
Aug 15 #Javascript
JavaScript 提升运行速度之循环篇 译文
Aug 15 #Javascript
jQuery ui 1.7更新小结
Aug 15 #Javascript
You might like
PHP大批量数据操作时临时调整内存与执行时间的方法
2011/04/20 PHP
PHP笔记之:基于面向对象设计的详解
2013/05/14 PHP
php常用ODBC函数集(详细)
2013/06/24 PHP
laravel实现于语言包的完美切换方法
2019/09/29 PHP
tp5.1 框架数据库常见操作详解【添加、删除、更新、查询】
2020/05/26 PHP
使用Apache的rewrite
2021/03/09 Servers
javascript hasFocus使用实例
2010/06/29 Javascript
整理一些JavaScript的IE和火狐的兼容性注意事项
2011/03/17 Javascript
基于jQuery的公告无限循环滚动实现代码
2012/05/11 Javascript
让你的博客飘雪花超出屏幕依然看得见
2013/01/04 Javascript
标题过长使用javascript按字节截取字符串
2014/04/24 Javascript
js实现适合新闻类图片的轮播效果
2017/02/05 Javascript
基于angular2 的 http服务封装的实例代码
2017/06/29 Javascript
微信小程序开发animation心跳动画效果
2017/08/16 Javascript
基于jQuery选择器之表单对象属性筛选选择器的实例
2017/09/19 jQuery
vue兄弟组件传递数据的实例
2018/09/06 Javascript
js逆向解密之网络爬虫
2019/05/30 Javascript
通过vue写一个瀑布流插件代码实例
2019/09/07 Javascript
[03:19]2016国际邀请赛中国区预选赛第四日TOP10镜头集锦
2016/07/01 DOTA
python僵尸进程产生的原因
2017/07/21 Python
python中pip的安装与使用教程
2018/08/10 Python
python如何实现视频转代码视频
2019/06/17 Python
使用Python实现文字转语音并生成wav文件的例子
2019/08/08 Python
Python捕获异常堆栈信息的几种方法(小结)
2020/05/18 Python
Python的控制结构之For、While、If循环问题
2020/06/30 Python
使用phonegap克隆和删除联系人的实现方法
2017/03/31 HTML / CSS
StubHub新加坡:购买和出售全球活动门票
2017/03/10 全球购物
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
Probikekit欧盟:在线公路自行车专家
2019/07/12 全球购物
求职简历自荐信范文
2013/10/21 职场文书
医院实习接收函
2014/01/12 职场文书
公司门卫岗位职责
2014/03/15 职场文书
镇创先争优活动总结
2014/08/28 职场文书
2014入党积极分子破除“四风”思想汇报
2014/09/14 职场文书
旷课检讨书范文
2015/01/27 职场文书
教师个人师德工作总结2015
2015/05/12 职场文书