日期插件

<meta charset="UTF-8" /><style>*{margin:0;padding:0}#Mcalendar{width:210px;padding:5px;height:170px;border:1px solid #045bb2;display:none;cursor: pointer;}table{text-align:right;clear: both;}table th{background-color:#045bb2;width:30px;}.date div{float:left;text-align:center;height:30px;line-height:30px;}#preYear,#nextYear{width:26px}#nextMonth,#preMonth{width:23px;}#McalendarInput{margin-left:100px;margin-top:100px;}</style>
<script>var Class={create:function(){return function(){this.initialize.apply(this,arguments)    }    }    }var extent=function(destination,source){for(var prop in source){    destination[prop]=source[prop];    }return destination;    }function fuzhi(a){document.getElementById("McalendarInput").value=http://www.mamicode.com/a;"Mcalendar").style.display="none";document.getElementById("Mcalendar").innerHTML="";    }var Mcalendar=Class.create();Mcalendar.prototype={initialize:function(options){var $ = new Date();this.setOption(options);this.drawCalendar($.getFullYear(),$.getMonth() + 1,$.getDate(),this.options.textfield_id);    },setOption:function(options){this.options={textfield_id: "Mcalendar"}extent(this.options,options||{})    },fillArray:function(year,month){var f = new Date(year, month -1 ,1).getDay();console.log(f)var arr=new Array(42);var dates = new Date(year, month , 0).getDate();console.log(dates)for(var i = 0; i < dates ; i ++ ,f ++){arr[f] =year+"-"+month+"-"+(i+1);    }return arr;    },getLeft:function(element){var actualLeft=element.offsetLeft;var current=element.offsetParent;if(current!=null){actualLeft+=current.offsetLeft;current=current.offsetParent;    }return actualLeft;    },getTop:function(element){var actualTop=element.offsetTop;var current=element.offsetParent;if(current!=null){actualTop+=current.offsetTop;current=current.offsetParent;    }return actualTop;    },drawCalendar:function(year,month,date,id){var $=this;var html="";html=‘
<
<<
‘;html+=‘
‘+year+‘年‘+month+‘月‘+date+‘日
>>
>
‘;var arr=["日","一","二","三","四","五","六"];html+=""for(var i=0;i<7;i++){html+=‘‘;    }html+=‘‘var arr1=$.fillArray(year,month);for(var j=0;j‘+ arr1[j].split(‘-‘)[2]+‘‘;    }else{html+=""html+=‘‘;    }    }html+="
‘+ arr[i]+‘
‘+ arr1[j].split(‘-‘)[2]+‘
";document.getElementById(id).style.display="block"document.getElementById(id).innerHTML=html;document.getElementById(‘nextYear‘).onclick=function(){$. redrawCalendar(year+1,month,date,id);    }document.getElementById(‘preYear‘).onclick=function(){$. redrawCalendar(year-1,month,date,id);    }document.getElementById(‘nextMonth‘).onclick=function(){if(month==12){$. redrawCalendar(year+1,1,date,id);    }else{$. redrawCalendar(year,month+1,date,id);    }    }document.getElementById(‘preMonth‘).onclick=function(){if(month==1){$. redrawCalendar(year-1,12,date,id);    }else{$. redrawCalendar(year,month-1,date,id);    }    }    },redrawCalendar:function(year, month,date,id){this. drawCalendar(year,month,date,id)    },selectDate:function(e){var attr=e.getAttribute("data-text");console.log(attr)/* if(attr[0]) {    alert(attr)    }*/}    }document.getElementById("McalendarInput").onfocus=function(){var bbb=new Mcalendar();var aaa=document.getElementById("McalendarInput");var k=document.getElementById("Mcalendar");k.style.position="absolute";k.style.left=bbb.getLeft(aaa)+"px";k.style.top= aaa.offsetHeight+bbb.getTop(aaa)+"px";    }</script>

日期插件