Jquery操作Select 简单方便 一个js插件搞定


Posted in Javascript onNovember 12, 2009

这里是js的代码:

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
然后再引入这个js文件,然后你就可以使用这些方法了
Javascript 相关文章推荐
编辑浪子版表单验证类
May 12 Javascript
from 表单提交返回值用post或者是get方法实现
Aug 21 Javascript
javascript中match函数的用法小结
Feb 08 Javascript
jsp网页搜索结果中实现选中一行使其高亮
Feb 17 Javascript
js function定义函数的几种不错方法
Feb 27 Javascript
JavaScript常用本地对象小结
Mar 28 Javascript
AngularJS入门教程之AngularJS模型
Apr 18 Javascript
laypage分页控件使用实例详解
May 19 Javascript
必备的JS调试技巧汇总
Jul 20 Javascript
使用JavaScript实现node.js中的path.join方法
Aug 12 Javascript
vscode 开发Vue项目的方法步骤
Nov 25 Javascript
浅谈Vue使用Cascader级联选择器数据回显中的坑
Oct 31 Javascript
jquery控制listbox中项的移动并排序
Nov 12 #Javascript
Jquery 获取表单text,areatext,radio,checkbox,select值的代码
Nov 12 #Javascript
两个select之间option的互相添加操作(jquery实现)
Nov 12 #Javascript
XHTML下,JS浮动代码失效的问题
Nov 12 #Javascript
把html页面的部分内容保存成新的html文件的jquery代码
Nov 12 #Javascript
Javascript 定时器调用传递参数的方法
Nov 12 #Javascript
Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别
Nov 12 #Javascript
You might like
PHP安全技术之 实现php基本安全
2010/09/04 PHP
PHP JS Ip地址及域名格式检测代码
2013/09/27 PHP
php基于base64解码图片与加密图片还原实例
2014/11/03 PHP
php和editplus正则表达式去除空白行
2015/04/17 PHP
Prototype使用指南之dom.js
2007/01/10 Javascript
javascript 函数调用规则
2009/08/26 Javascript
JS运行耗时操作的延时显示方法
2010/11/19 Javascript
JQuery中html()方法使用不当带来的陷阱
2011/04/07 Javascript
js获取当前日期代码适用于网页头部
2013/06/27 Javascript
jQuery中insertBefore()方法用法实例
2015/01/08 Javascript
通过实例理解javascript中没有函数重载的概念
2015/06/03 Javascript
jquery实现左右滑动菜单效果代码
2015/08/27 Javascript
JS+DIV+CSS排版布局实现美观的选项卡效果
2015/10/10 Javascript
使用EVAL处理jqchart jquery 折线图返回数据无效的解决办法
2015/11/26 Javascript
基于JavaScript实现抽奖系统
2018/01/16 Javascript
微信小程序实现循环动画效果
2018/07/16 Javascript
微信小程序wx:for循环的实例详解
2018/10/07 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
2018/12/28 Javascript
Node.JS枚举统计当前文件夹和子目录下所有代码文件行数
2019/08/23 Javascript
基于js实现复制内容到操作系统粘贴板过程解析
2019/10/11 Javascript
JS控制GIF图片的停止与显示
2019/10/24 Javascript
详解Vue 单文件组件的三种写法
2020/02/19 Javascript
js实现翻牌小游戏
2020/07/31 Javascript
对Python 窗体(tkinter)树状数据(Treeview)详解
2018/10/11 Python
Python实现的企业粉丝抽奖功能示例
2019/07/26 Python
django haystack实现全文检索的示例代码
2020/06/24 Python
Python闭包装饰器使用方法汇总
2020/06/29 Python
numpy实现RNN原理实现
2021/03/02 Python
美国婴儿用品店:Babies”R”Us
2017/10/12 全球购物
什么是URL
2015/12/13 面试题
如何反序的迭代一个序列?how do I iterate over a sequence in reverse order
2012/02/04 面试题
怎么写有吸引力的自荐信
2013/11/17 职场文书
党员剖析材料范文
2014/09/30 职场文书
见习报告的格式
2014/11/04 职场文书
2014年统计工作总结
2014/11/21 职场文书
财务会计个人原因辞职信
2019/06/21 职场文书