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.selectlist.js插件实现的下拉框美化特效,简单的jQuery select下拉框美化代码。
一组经过美化的jQuery select下拉框单选和多选插件,带搜索功能,模拟select下拉框多选菜单选择效果。
jquery.selectlist.js下拉框美化插件是一款绿色清新风格简单的表单select下拉框美化特效,让下拉框看起来更加漂亮,不再单调。
jquery 封装select实现select自定义样式的完美插件jquery.easydropdown.min.js
jquery下拉框选择select美化插件FancySelect.js
select 检索插件jquery框架,根据输入内容自动过滤select 选项
简单实用的jquery select2组件
jQuery模拟select下拉框插件是一款支持多选和单选下拉框菜单选中代码。
美化了单选框和复选框丑丑的问题,具体使用文档参考:http://blog.csdn.net/qq_19558705/article/details/49978731
此为jquery.editable-select插件的使用案例,这是一款非常好用的插件,好用之处:既可下拉框选择也可手动输入,而且手动输入还能对下拉框选项进行过滤,而且还可实现一些相关事件,具体请查看官方文档。
jQuery自定select下拉框样式插件jquery.select.js
结合jQueryUI对select下拉框美化插件,很不错的多功能下拉框美化,效果是非常不错的,插件支持 自定义参数功能,定义高度,下拉动画效果,下拉的速度,还是很不错的,大家该把传统的select下 拉框的样式改造的时候...
这是一款select下拉框的效果主要是运用jquery.select.js插件进行操作的非常简便易用
jQuery-ComboSelect插件
jquery.editable-select插件
select3是一款基于jQuery或Zepto.js的轻量级模块化select下拉列表框插件。select3下拉列表框可以进行单选、以tag的形式进行多选、可以指定输入类型格式、可以进行分组选择、还可以ajax进行远程调用。
jQuery美化Select下拉菜单插件
引入js文件 [removed][removed] [removed][removed] [removed][removed] [removed][removed] [removed][removed]
有兴趣刚需的可以自己下载,非常实用的jquery代码,可以完美运行,有能力的还可以二次修改!
SelectMenu.js是一款简洁、易用、多样的jquery下拉菜单插件。SelectMenu下拉菜单插件功能强大,支持下拉,分页,键盘操作等功能。