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 相关文章推荐
快速保存网页中所有图片的方法
Jun 23 Javascript
获取Javscript执行函数名称的方法
Dec 22 Javascript
从新浪弄下来的全屏广告代码 与使用说明
Mar 15 Javascript
有关javascript的性能优化 (repaint和reflow)
Apr 12 Javascript
导入extjs、jquery 文件时$使用冲突问题解决方法
Jan 14 Javascript
分享一个自己动手写的jQuery分页插件
Aug 28 Javascript
javascript实现checkbox全选的代码
Apr 30 Javascript
Javascript实现base64的加密解密方法示例
Jun 27 Javascript
javascript中神奇的 Date对象小结
Oct 12 Javascript
学习Vue组件实例
Apr 28 Javascript
AngularJS动态生成select下拉框的方法实例
Nov 17 Javascript
Vue提供的三种调试方式你知道吗
Jan 18 Vue.js
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
SONY ICF-SW07收音机电路分析
2021/03/02 无线电
模拟xcopy的函数
2006/10/09 PHP
PHP4.04简明安装
2006/10/09 PHP
个人站长制做网页常用的php代码
2007/03/03 PHP
屏蔽网页右键复制和ctrl+c复制的js代码
2013/01/04 Javascript
60个很实用的jQuery代码开发技巧收集
2014/12/15 Javascript
js分页工具实例
2015/01/28 Javascript
深入探讨JavaScript String对象
2015/03/09 Javascript
js面向对象之公有、私有、静态属性和方法详解
2015/04/17 Javascript
js实现仿qq消息的弹出窗效果
2016/01/06 Javascript
js print打印网页指定区域内容的简单实例
2016/11/01 Javascript
jQuery插件autocomplete使用详解
2017/02/04 Javascript
js判断PC端与移动端跳转
2020/12/24 Javascript
javascript实现二叉树遍历的代码
2017/06/08 Javascript
Angular使用 ng-img-max 调整浏览器中的图片的示例代码
2017/08/17 Javascript
详解使用Typescript开发node.js项目(简单的环境配置)
2017/10/09 Javascript
iview中Select 选择器多选校验方法
2018/03/15 Javascript
Babel 入门教程学习笔记
2018/06/13 Javascript
vue中的router-view组件的使用教程
2018/10/23 Javascript
国内常用的js类库大全(CDN公共库)
2020/06/24 Javascript
python中安装Scrapy模块依赖包汇总
2017/07/02 Python
一道python走迷宫算法题
2018/01/22 Python
教你利用Python玩转histogram直方图的五种方法
2018/07/30 Python
Python简易计算器制作方法代码详解
2019/10/31 Python
利用jupyter网页版本进行python函数查询方式
2020/04/14 Python
HTML5 CSS3给网站设计带来出色效果
2009/07/16 HTML / CSS
施华洛世奇巴西官网:SWAROVSKI巴西
2019/12/03 全球购物
在C语言中实现抽象数据类型什么方法最好
2014/06/26 面试题
学生拾金不昧表扬信
2014/01/21 职场文书
争论的故事教学反思
2014/02/06 职场文书
公务员转正考察材料
2014/02/07 职场文书
高级编程求职信模板
2014/02/16 职场文书
环保建议书作文
2014/03/12 职场文书
2014年审计工作总结
2014/11/17 职场文书
自主招生自荐信格式
2015/03/04 职场文书
Win11安装升级时提示“该电脑必须支持安全启动”
2022/04/19 数码科技