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 相关文章推荐
JavaScript 设计模式之组合模式解析
Apr 09 Javascript
Javascript Objects详解
Sep 04 Javascript
js实现编辑div节点名称的方法
Dec 17 Javascript
程序员必知35个jQuery 代码片段
Nov 05 Javascript
jQuery数据类型小结(14个)
Jan 08 Javascript
基于JS实现textarea中获取动态剩余字数的方法
May 25 Javascript
微信小程序富文本渲染引擎的详解
Sep 30 Javascript
浅谈Vue-cli 命令行工具分析
Nov 22 Javascript
Swiper 4.x 使用方法(移动端网站的内容触摸滑动)
May 17 Javascript
Vue自定义指令上报Google Analytics事件统计的方法
Feb 25 Javascript
基于Web Audio API实现音频可视化效果
Jun 12 Javascript
前端性能优化建议
Sep 17 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 多线程上下文中安全写文件实现代码
2009/12/28 PHP
PHP 防恶意刷新实现代码
2010/05/16 PHP
PHP判断是否是微信打开还是浏览器打开的方法
2019/02/27 PHP
详解PHP PDO简单教程
2019/05/28 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
根据出生日期自动取得星座的js代码
2010/07/20 Javascript
asp.net中System.Timers.Timer的使用方法
2013/03/20 Javascript
对js关键字命名的疑问介绍
2014/04/25 Javascript
tuzhu_req.js 实现仿百度图片首页效果
2015/08/11 Javascript
jQuery实现文本框邮箱输入自动补全效果
2015/11/17 Javascript
JQuery Mobile实现导航栏和页脚
2016/03/09 Javascript
jQuery增加和删除表格项目及实现表格项目排序的方法
2016/05/30 Javascript
全面理解闭包机制
2016/07/11 Javascript
JavaScript reduce和reduceRight详解
2016/10/24 Javascript
AngularJS实现页面跳转后自动弹出对话框实例代码
2017/08/02 Javascript
JavaScript实现三级联动菜单效果
2017/08/16 Javascript
微信小程序picker组件下拉框选择input输入框的实例
2017/09/20 Javascript
微信小程序如何获取openid及用户信息
2018/01/26 Javascript
python实现DNS正向查询、反向查询的例子
2014/04/25 Python
Python冒泡排序注意要点实例详解
2016/09/09 Python
python MySQLdb使用教程详解
2018/03/20 Python
python代码 输入数字使其反向输出的方法
2018/12/22 Python
Python 实现文件打包、上传与校验的方法
2019/02/13 Python
python实现的按要求生成手机号功能示例
2019/10/08 Python
Python scrapy增量爬取实例及实现过程解析
2019/12/24 Python
Python pandas如何向excel添加数据
2020/05/22 Python
python爬取代理ip的示例
2020/12/18 Python
html5 touch事件实现触屏页面上下滑动(二)
2016/03/10 HTML / CSS
用html5实现语音搜索框的方法
2014/03/18 HTML / CSS
欧洲第一中国智能手机和平板电脑网上商店:CECT-SHOP
2018/01/08 全球购物
2014预备党员党课学习心得范文
2014/07/08 职场文书
2014年秋季新学期寄语
2014/08/02 职场文书
2014年社区宣传工作总结
2014/12/02 职场文书
拾金不昧表扬信怎么写
2015/05/04 职场文书
嘉年华活动新闻稿
2015/07/17 职场文书
2015年中学团委工作总结
2015/07/22 职场文书