基于jquery写的选择年月日出生日期的插件

<li>
<label class="label"><span class="star">*</span>生日:</label>
<select class="sel_year">
</select>年
<select class="sel_month">
</select>月
<select class="sel_day">
</select>日
</li> 使用方法: <script type="text/javascript">
$(function () {
// 出生年月插件
$.ms_DatePicker({
YearSelector: ".sel_year",
MonthSelector: ".sel_month",
DaySelector: ".sel_day"
});
});
</script> 插件代码: (function($){
$.extend({
ms_DatePicker: function (options) {
var defaults = {
YearSelector: "#sel_year",
MonthSelector: "#sel_month",
DaySelector: "#sel_day",
FirstText: "--",
FirstValue: 0
};
var opts = $.extend({}, defaults, options);
var $YearSelector = $(opts.YearSelector);
var $MonthSelector = $(opts.MonthSelector);
var $DaySelector = $(opts.DaySelector);
var FirstText = opts.FirstText;
var FirstValue = opts.FirstValue; // 初始化
var str = "<option value=\"" + FirstValue + "\">" + FirstText + "</option>";
$YearSelector.html(str);
$MonthSelector.html(str);
$DaySelector.html(str); // 年份列表
var yearNow = new Date().getFullYear();
for (var i = yearNow; i >= 1900; i--) {
var yearStr = "<option value=\"" + i + "\">" + i + "</option>";
$YearSelector.append(yearStr);
} // 月份列表
for (var i = 1; i <= 12; i++) {
var monthStr = "<option value=\"" + i + "\">" + i + "</option>";
$MonthSelector.append(monthStr);
} // 日列表(仅当选择了年月)
function BuildDay() {
if ($YearSelector.val() == 0 || $MonthSelector.val() == 0) {
// 未选择年份或者月份
$DaySelector.html(str);
} else {
$DaySelector.html(str);
var year = parseInt($YearSelector.val());
var month = parseInt($MonthSelector.val());
var dayCount = 0;
switch (month) {
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
dayCount = 31;
break;
case 4:
case 6:
case 9:
case 11:
dayCount = 30;
break;
case 2:
dayCount = 28;
if ((year % 4 == 0) && (year % 100 != 0) || (year % 400 == 0)) {
dayCount = 29;
}
break;
default:
break;
} for (var i = 1; i <= dayCount; i++) {
var dayStr = "<option value=\"" + i + "\">" + i + "</option>";
$DaySelector.append(dayStr);
}
}
}
$MonthSelector.change(function () {
BuildDay();
});
$YearSelector.change(function () {
BuildDay();
});
} // End ms_DatePicker
});
})(jQuery);

jQuery插件:简易年月日选择器的更多相关文章

  1. 推荐60个jQuery插件(转)

    jQuery插件jQuery Spin Button自定义文本框数值自增或自减 jQuery插件JQuery Pager分页器实现javascript分页功能 jQuery插件FontSizer实现J ...

  2. jquery系列教程7-自定义jquery插件全解:对象函数、全局函数、选择器

    点击打开: jquery系列教程1-选择器全解 jquery系列教程2-style样式操作全解 jquery系列教程3-DOM操作全解 jquery系列教程4-事件操作全解 jquery系列教程5-动 ...

  3. 10个精选的颜色选择器Javascript脚本及其jQuery插件

     Color picker即颜色选择器使我们在web开发中可能经常用到的组件,今天我们特意精选了10个超酷的颜色选择器实现,其中包括了javascript脚本 实现及其传说中的jQuery插件实现 ...

  4. 简易jQuery插件

    之前写过jQuery插件的笔记 如何用jQuery封装插件 我一直觉得前面讲了一大堆闭包和三种插件封装模式有点冗余,那篇笔记我直到记录到后面才发现这事情很简单,想来想去还是觉得网上的一些文章把事情搞复 ...

  5. -_-#【jQuery插件】Colorpicker 颜色选择器

    Spectrum - The No Hassle jQuery Colorpicker (jQuery 插件) Color Picker jQuery plugins (jQuery 插件) colo ...

  6. 40 个让你的网站更加友好的 jQuery 插件

    一个插件的基本功能是执行一个含有元素集合的函数数组.每个方法和jQuery核心组成一个插件,如.fadeOut()或.addClass().一个jQuery插件是一个基本的可以扩充jQuery 原型对 ...

  7. 40个让你的网站屌到爆的jQuery插件

    一 个插件的基本功能是执行一个含有元素集合的函数数组.每个方法和jQuery核心组成一个插件,如.fadeOut()或.addClass().一个 jQuery插件是一个基本的可以扩充jQuery 原 ...

  8. 常用JQuery插件

    虽然自己也写过插件,但JQuery插件种类的繁多,大多时候,我还是使用别人写好的插件,这些都是我用了同类插件里较为不错的一些,今天就整理一下公开放出来. UI: jquery.HooRay(哈哈,自己 ...

  9. 一些常用的jQuery插件

    1. X-editable 这个插件能够让你在页面上创建可编辑的元素.它能够使用任何引擎(bootstrap.jquery-ui.jquery),并且包含弹出式和内联模式. 2. Garlic.js ...

随机推荐

  1. git学习,什么是git?

    什么是 Git? 百度百科显示,Git是 Linux 之父 Linus Trovalds,为管理 Linux 内核代码而建立的,被认为是分布式版本控制工具中的顶级水准.智能.友好.强健.高效. 正如所 ...

  2. HDU 5763 Another Meaning KMP+DP

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=5763 Another Meaning Time Limit: 2000/1000 MS (Java/ ...

  3. 临时文档9--dfs

    #include<iostream> #include<stdio.h> #include<math.h> #include<string.h> usi ...

  4. DOM中事件绑定补充方法

    先将上一篇文章中提到的为元素增加事件的方法和移除事件的方法拿过来: <span style="font-size:18px;">//跨浏览器添加事件 function ...

  5. GameMap(类结构)(不断跟新)

    暂时有个疑问为什么这些需要这么复杂的继承

  6. jquery中如何退出each循环

    在for循环中我们用continue退出当前循环,进入下一循环.用break跳出所有循环. 可是在jQuery中却并没有这两条命令,那么如何退出each循环呢? 经过查询得知: 在jQuery中用 r ...

  7. CSS3:线上编辑工具及实用资料整理

    an I Use 个人最常用的,资料比较全,桌面和移动浏览器支持HTML5,CSS3,SVG和兼容性表. 官网地址:http://caniuse.com/ CSS3 Click Chart CSS3 ...

  8. 用DIV+CSS切割多背景合并图片 CSS Sprites 技术

    很久之前就在互联网网站和一些js插件中见过这种技术的应用,当时觉得很麻烦,就没有用,也没有去深究. 近段时间一直在做前台的一些东西,涉及到很多div+css的问题.这个东东我又碰到了,所以我花了点时间 ...

  9. 超快的 FastText

    Word2Vec 作者.脸书科学家 Mikolov 文本分类新作 fastText:方法简单,号称并不需要深度学习那样几小时或者几天的训练时间,在普通 CPU 上最快几十秒就可以训练模型,得到不错的结 ...

  10. root 授权

    错误:The user specified as a definer ('root'@'%') does not exist 解决: grant all privileges on *.* to ro ...