基于jQuery下拉日期插件

第一次写jquery插件,基于业务来实现,通用性并不强,存个档。

/**
 * jQuery.selectDate
 * jQuery 下拉列表选择日期插件
 * @author<a target=_blank href="http://my.csdn.net/" class="user_name" style="list-style: none; word-break: break-all; word-wrap: break-word; margin: 0px 1em 0px 0px; padding: 0px; font-stretch: normal;">瑾色年華</a>
 *
 */
(function($){
	"use strict";
	 var defaultOptions = {
			 begin: 1960,
			 end: new Date().getFullYear()
	        };
	 var selectDate = function(self, option){
	        var $self  = this;
	        $self.opt = $.extend({}, defaultOptions, option);
	        $self.elem = self;
	        $self.init();
	    };
	 selectDate.prototype = {
			 init: function(){
				 var $self = this
	                , opt = $self.opt
	                , elem = $self.elem;
				var year=$(elem[0]),month=$(elem[1]),day=$(elem[2]);
				for(var i=opt.end;i>=opt.begin;i--){
					$self.addChildren(year,i);
				}
				for(var i=1;i<=12;i++){
					$self.addChildren(month,i<10?"0"+i:i);
				}
				$(".overview.date:lt(2)").on("click",function(){
					var year=parseInt($(".overview.date").eq(0).find("li.selected a").text());
					var month=parseInt($(".overview.date").eq(1).find("li.selected a").text());
					$(".overview.date").eq(2).empty();
					if(year&&month){
						for(var i=1;i<=new Date(year,month,0).getDate();i++){
							var children=$("<li><a>"+(i<10?"0"+i:i)+"</a></li>")
							$(".overview.date").eq(2).append(children);
						}
					}
				})
			 },addChildren:function(parent,text){
				 var children=$("<li><a>"+text+"</a></li>");
				 return parent.append(children);
			 }
		        
	 }

	 function plugin(option) {
	        new selectDate(this,option);
	        return this;
	    }

	  $.fn.selectDate= plugin;
	  $.fn.selectDate.Constructor = selectDate;
})(jQuery)

具体效果如下:



  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值