一个简单横向javascript日期控件

　　var logDateControl=(function(){

　　var curSelEl;  //当前选中的日期

　　var styleData=[],dataStyle={};

　　//获取指定id的元素

　　var $=function(id){return document.getElementById(id)}

　　//计算指定日期是第几周（默认为当前日期），该计算方法比较严密准确

　　var calWeek=function(dt){

　　var calDay=dt||new Date();  //当前要计算的时间

　　var firstDay=new Date(calDay.getFullYear(),0,1);  //本年第一天

　　//计算当前是本年的第几天,00：00为当天开始

　　var daysAll=Math.floor((calDay-firstDay)/1000/60/60/24)+1;

　　//本年第一天星期几

　　var firstDayWeekday=firstDay.getDay();

　　//该结果加到第一周的周一，便于后面计算

　　var diffDay=firstDayWeekday==0?6:firstDayWeekday-1;

　　daysAll=daysAll+diffDay;

　　return Math.ceil(daysAll/7);  //返回计算结果

　　}

　　//计算一个月多少天,年份4位数字，月份1-2位数字（应该是js日期格式如1月传入0）,数据非法返回-1

　　var getDaysLen=function(year,month){

　　if(!(/^\d{4}$/.test(year)&&/^\d{1,2}$/.test(month))){return -1}

　　var monthDays=[31,28,31,30,31,30,31,31,30,31,30,31]

　　//存在2月29日

　　if(month==1&&new Date(year,1,29).getMonth()==1){monthDays[1]=29}

　　return monthDays[month]

　　}

　　//显示日期列表,传入年、月(按日常月份传入。如二月传入2)、及显示位置

　　var displayDayList=function(year,month,pos){

　　var daysList=[];

　　var cells1=$(pos).rows[0].cells;

　　var cells2=$(pos).rows[1].cells;

　　var daysArr=['日','一','二','三','四','五','六'];

　　//下面的month-1转换为js月份表示

　　for(var i=1,l=getDaysLen(year,--month)+1;i<l;i++){

　　var wd=new Date(year,month,i).getDay();

　　cells1[i-1].className="";

　　if(wd==0||wd==6){cells1[i-1].className="weekEnd";}  //为周末添加特殊样式

　　//_oldCls保存当前日期的默认样式

　　cells1[i-1].innerText=daysArr[wd];

　　cells2[i-1].className="unSelectDay";

　　cells2[i-1].setAttribute("_oldCls","unSelectDay");

　　cells2[i-1].innerText=i>9?i:"0"+i;

　　//匹配用户自定义样式

　　var dtStr=year+"|"+(month+1)+"|"+i;

　　if((","+styleData.join(',')+",").indexOf(","+dtStr+",")>-1){

　　cells2[i-1].className="unSelectDay "+dataStyle[dtStr];

　　cells2[i-1].setAttribute("_oldCls","unSelectDay "+dataStyle[dtStr]);

　　}

　　}

　　//如果是当前月则选中当日

　　if(new Date().getMonth()==month){

　　curSelEl=cells2[new Date().getDate()-1];

　　curSelEl.className="selectDay";

　　}

　　for(var j=i-1;j<31;j++){

　　cells1[j].className=cells2[j].className="";

　　cells1[j].innerHTML=cells2[j].innerHTML="  ";

　　}

　　$(pos).onclick=function(){changeInfo()}

　　}

　　//根据选择的值进行处理周次和周几的调整,可以直接传入保存日期内容的dom元素，或者函数根据点击位置判断

　　var changeInfo=function(e){

　　e=e||event;

　　var el=e.target||e.srcElement||e;  //最后一个e：可能是传入的对象

　　var day=el.innerText;

　　if(!/^\d{1,2}$/.test(day)) return;  //如果不是日期什么都不做

　　//恢复之前选中日期的样式

　　if(curSelEl){curSelEl.className=curSelEl.getAttribute("_oldCls")}

　　curSelEl=el;  //保存当前处理的元素

　　//更新选中日期的样式

　　el.className="selectDay";

　　var dt=new Date($("year").value,$("month").value-1,day);

　　//更新信息

　　$("day").value=day;  //日期

　　$("weekday").value=['日','一','二','三','四','五','六'][dt.getDay()];  //星期几

　　$("week").value=calWeek(dt);  //第几周

　　}

　　//初始化

　　window.attachEvent("onload",function(){

　　var curDate=new Date(),curYear=curDate.getFullYear();

　　//显示上下十年

　　for(var i=-10;i<10;i++){$("year").add(new Option(curYear+i,curYear+i))}

　　$("year").selectedIndex=10;  //默认选中当前年份

　　$("month").selectedIndex=curDate.getMonth();  //当前月份

　　$("day").value=curDate.getDate();  //当前日期

　　$("weekday").value=['日','一','二','三','四','五','六'][curDate.getDay()];  //当前星期几

　　$("week").value=calWeek();  //当前第几周

　　//改变日期或年份更新日期列表

　　$("year").onchange=$("month").onchange=function(){displayDayList($("year").value,$("month").value,"daysList")};

　　//显示当月日期列表,并高亮当天的日期

　　displayDayList(curDate.getFullYear(),curDate.getMonth()+1,"daysList");

　　});

　　//对外设定样式的接口。

　　//格式：([2007,10,12],"color:#f00") ([[2007,10,20],[2007,11,25]],"color:#00f")

　　//如果月份小于10不要带0

　　var setDateStyle=function(dateArr,style){

　　if(typeof dateArr!="object")return;

　　if(dateArr instanceof Array){

　　if(dateArr[0] instanceof Array){

　　for(var i=0;i<dateArr.length;i++) setDateStyle(dateArr[i],style);

　　}

　　var dataStr=dateArr.join('|');

　　styleData.push(dataStr);

　　dataStyle[dataStr]=style;

　　return;

　　}

　　}

　　//对外接口

　　return {setDateStyle:setDateStyle}

　　})();

　　//测试样式设定

　　logDateControl.setDateStyle([[2007,12,15],[2007,11,12]],"test");