jquery select操作的日期联动实现代码_jquery

Jquery的选择器很强大,对select的options对象添加的时候我找了老半天才找到

复制代码 代码如下:

/**//*
文件名:jquery.liu.select.js
功能说明:本js文件为jquery类库的一个插件,主要实现对select的操作.
作者:John Liu
编写日期:2008/03/12
*/
//得到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;
}

时间: 2024-11-20 13:41:01

jquery select操作的日期联动实现代码_jquery的相关文章

jQuery 特性操作详解及实例代码_jquery

前面的话 每个元素都有一个或者多个特性,这些特性的用途就是给出相应元素或者其内容的附加信息.操作特性的DOM方法主要有3个:getAttribute()方法.setAttribute()方法和removeAttribute()方法,而在jQuery中用一个attr()与removeAttr()就可以全部搞定了,包括兼容问题.本文将介绍jQuery中的特性操作 获取特性 jQuery中用attr()方法来获取和设置特性,attr是attribute(特性)的缩写,在jQuery DOM操作中会经常

基于JQuery的日期联动实现代码_jquery

实现目标: 两个日期,有下拉框: 复制代码 代码如下: <head> //导入jquery地址 <script src="(Jquery地址)" language="JavaScript" type="text/javascript"></script> <script type="text/javascript"> //startYear发生变化 function change

Jquery实现无刷新DropDownList联动实现代码_jquery

先看HTML,我们引用Jquery,放两个DropDownList: 复制代码 代码如下: <style type="text/css"> #ddlEmployeeCars { display:none; position:absolute; top:50px; left:9px; } </style> <script language="javascript" type="text/javascript" src=

jquery select 设置默认选中的示例代码_jquery

代码如下: 其中<%=selectedvalue %>为从后台获取的值 $(document).ready(function(){   $("#seltype").attr("value",parseInt('<%=selectedvalue %>')); })

jquery select 设置默认选中的示例代码

 本篇文章主要是对jquery select 设置默认选中的示例代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 代码如下:   其中<%=selectedvalue %>为从后台获取的值   $(document).ready(function(){    $("#seltype").attr("value",parseInt('<%=selectedvalue %>'));  })    

jquery利用json实现地区联动效果代码

jquery利用json实现地区联动效果代码 不过看到的里面json类型格式设计的挺好的,一般我们后台未做任何处理的json数据格式类似以下这样子的 [{"Code":3231,"Name":"长春市"}, {"Code":3232,"Name":"吉林市}] 如果有一万个地区,会多出几万个字符,这么奢侈的做法我想我还是放弃了吧 地区表大致设计为 AT_Id :唯一标识,json里面对应的code

jQuery带时间的日期控件代码分享_jquery

本文实例讲述了JS+CSS3实现的类似于苹果iwatch计时器特效.分享给大家供大家参考.具体如下: 带时间的jQuery日期控件代码是一款基于jQueryUI实现的,可自定义日期插件语言,这个日期控件的亮点就在于选择的时间可精确到分钟. 运行效果图:                    -------------------查看效果 下载源码------------------- 小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式. 为大家分享的jQuery带时间的日期控件代码如下 <h

jQuery select表单提交省市区城市三级联动核心代码_jquery

jQuery select表单提交省市区城市三级联动,引用的是"jquery-1.7.min"类库,地区码查询地区名用数组存在AreaData_min,下面摘要部分代码: SelectArea.htm文件 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transition

jQuery实现日期联动效果实例_jquery

本文实例讲述了jQuery实现日期联动效果的方法.分享给大家供大家参考,具体如下: 实现目标: 两个日期,有下拉框: <head> //导入jquery地址 <script src="jquery-1.7.2.min.js" language="JavaScript" type="text/javascript"></script> <script type="text/javascript&q