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 相关文章推荐
多浏览器兼容的获取元素和鼠标的位置的js代码
Dec 15 Javascript
javascript 常用功能总结
Mar 18 Javascript
javascript根据像素点取位置示例
Jan 27 Javascript
javascript实现数字验证码的简单实例
Feb 10 Javascript
jquery选择器排除某个DOM元素的方法(实例演示)
Apr 25 Javascript
ES6中参数的默认值语法介绍
May 03 Javascript
详解AngularJS用Interceptors来统一处理HTTP请求和响应
Jun 08 Javascript
利用jqprint插件打印页面内容的实现方法
Jan 09 Javascript
如何使用VuePress搭建一个类型element ui文档
Feb 14 Javascript
ES6入门教程之变量的解构赋值详解
Apr 13 Javascript
JS中实现一个下载进度条及播放进度条的代码
Jun 10 Javascript
vue中解决拖拽改变存在iframe的div大小时卡顿问题
Jul 22 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
杏林同学录(一)
2006/10/09 PHP
PHP 学习路线与时间表
2010/02/21 PHP
PHP 异步执行方法,模拟多线程的应用分析
2013/06/03 PHP
php使用fopen创建utf8编码文件的方法
2014/10/31 PHP
Firefox 无法获取cssRules 的解决办法
2006/10/11 Javascript
Javascript写了一个清除“logo1_.exe”的杀毒工具(可扫描目录)
2007/02/09 Javascript
Javascript中定义方法的另类写法(批量定义js对象的方法)
2011/02/25 Javascript
js复制到剪切板的实例方法
2013/06/28 Javascript
使用JavaScript实现Java的List功能(实例讲解)
2013/11/07 Javascript
JSON无限折叠菜单编写实例
2013/12/16 Javascript
javascript简单实现命名空间效果
2014/03/06 Javascript
javascript实现根据iphone屏幕方向调用不同样式表的方法
2015/07/13 Javascript
jquery 全选、全不选、反选效果的实现代码【推荐】
2016/05/05 Javascript
js字符串操作总结(必看篇)
2016/11/22 Javascript
Angular2学习教程之组件中的DOM操作详解
2017/05/28 Javascript
AngularJS的$location使用方法详解
2017/10/19 Javascript
Vue + Vue-router 同名路由切换数据不更新的方法
2017/11/20 Javascript
Python isinstance判断对象类型
2008/09/06 Python
你应该知道的python列表去重方法
2017/01/17 Python
Ubuntu 下 vim 搭建python 环境 配置
2017/06/12 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
Django中使用 Closure Table 储存无限分级数据
2019/06/06 Python
flask/django 动态查询表结构相同表名不同数据的Model实现方法
2019/08/29 Python
Pytorch 神经网络—自定义数据集上实现教程
2020/01/07 Python
Python3实现mysql连接和数据框的形成(实例代码)
2020/01/17 Python
解决pyecharts运行后产生的html文件用浏览器打开空白
2020/03/11 Python
标记环网Toke Ring IEEE802.5
2014/05/26 面试题
信息服务专业毕业生求职信
2014/03/02 职场文书
物资采购方案
2014/06/12 职场文书
歌颂党的演讲稿
2014/09/10 职场文书
党员干部反四风对照检查材料思想汇报
2014/09/14 职场文书
爱晚亭导游词
2015/02/09 职场文书
职称评定个人总结
2015/03/05 职场文书
体育部部长竞选稿
2015/11/21 职场文书
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android
python装饰器代码解析
2022/03/23 Python