基于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. maven ArtifactTransferException: Failure to transfer

    我在使用Myeclipse碰见这个错误,我没有用伺服,直接连接到maven中心. ArtifactTransferException: Failure to transfer org.apache.h ...

  2. max_flow(Dinic) 分类: ACM TYPE 2014-09-02 15:42 94人阅读 评论(0) 收藏

    #include <cstdio> #include <iostream> #include <cstring> #include<queue> #in ...

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

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

  4. tomcat 一个服务 多端口网站

    多站点多端口   <Service name="Catalina">      <Connector port="8080" protocol ...

  5. 【翻译】Sencha Touch2.4 The Layout System 布局

    [翻译]The Layout System 布局 In Sencha Touch there are two basic building blocks: componentsand containe ...

  6. KMP--路过

    HDU 1358:弄清楚了NEXT,就好解决,还有不要再循环中用strlen;会超 ----------------------我是凑字数的------------------还是不会KMP----- ...

  7. Android App集成支付宝

    原地址:http://blog.csdn.net/wenbingoon/article/details/7933078 手机的在线支付,被认为是2012年最看好的功能,我个人认为这也是移动互联网较传统 ...

  8. Assetbundle的杂七杂八

    使用Assetbundle时可能遇到的坑 一 24 十一郎未分类 No Comments 转自 http://www.unitymanual.com/blog-3571-132.html 1.Edit ...

  9. POJ 1316

    #include<iostream> using namespace std; #define NUM 10000 int main(){ }; int i; ; int j; ;i< ...

  10. (1)opengl-nehe 4种框架

    http://www.yakergong.net/nehe/ 这个网站还是opengl方面比较权威的,作者叫nehe 这东西估计是要先装个ndk,然后才能运行代码 先睡觉! 以下内容参考自http:/ ...