javascript日期控件小集合

       在网页中经常可能需要输入一些时间,如果全部手动输入难以保证准确率,所以收集了一些时间控件。

	<script language="JavaScript">
			<!--
/* 调用方法:
  <input οnfοcus="calendar()" name="s2" type="text" id="s2" style="width:100;" />
*/
var cal_Width = 180;//定义日历显示的宽度,至少140

document.write("<div id='meizzCalendarLayer' style='position: absolute; z-index: 9999; width: " + (cal_Width+4).toString() + "px; height: 193px; display: none'>");
document.write("<iframe name='meizzCalendarIframe' scrolling='no' frameborder='0' width='100%' height='100%'></iframe></div>");
var WebCalendar = new WebCalendar();

function document.onclick()
{
    if(WebCalendar.eventSrc != window.event.srcElement) hiddenCalendar();
}

function WebCalendar() //初始化日历的设置
{
    this.regInfo    = "WEB Calendar ver 3.0
关闭的快捷键:[Esc]";
    
    this.dayShow    = 38;                       //定义页面上要显示的天数,不能小于35,或大于39
    this.daysMonth  = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
    this.day        = new Array(this.dayShow);            //定义日历展示用的数组
    this.dayObj     = new Array(this.dayShow);            //定义日期展示控件数组
    this.dateStyle  = null;                     //保存格式化后日期数组
    this.objExport  = null;                     //日历回传的显示控件
    this.eventSrc   = null;                     //日历显示的触发控件
    this.inputDate  = null;                     //转化外的输入的日期(d/m/yyyy)
    this.thisYear   = new Date().getFullYear(); //定义年的变量的初始值
    this.thisMonth  = new Date().getMonth()+ 1; //定义月的变量的初始值
    this.thisDay    = new Date().getDate();     //定义日的变量的初始值
    this.today      = this.thisDay +"/"+ this.thisMonth +"/"+ this.thisYear;   //今天(d/m/yyyy)
    this.iframe     = window.frames("meizzCalendarIframe"); //日历的 iframe 载体
    this.calendar   = getObjectById("meizzCalendarLayer");  //日历的层
    this.dateReg    = "";           //日历格式验证的正则式

    this.yearFall   = 50;           //定义显示的年份下拉框的年差值,如果今年是2000年,这里设置为50,就显示1950-2050
    this.format     = "yyyy-mm-dd"; //回传日期的格式
    this.timeShow   = false;        //是否返回时间
    this.drag       = true;         //是否允许拖动
    this.darkColor  = "#95B7F3";    //控件的暗色
    this.lightColor = "#FFFFFF";    //控件的亮色
    this.btnBgColor = "#E6E6FA";    //控件的按钮背景色
    this.wordColor  = "#000080";    //控件的文字颜色
    this.wordDark   = "#DCDCDC";    //控件的暗文字颜色
    this.dayBgColor = "#F5F5FA";    //日期数字背景色
    this.todayColor = "#FF0000";    //今天在日历上的标示背景色
    this.DarkBorder = "#D4D0C8";    //日期显示的立体表达色
    
    this.yearOption = "";
    var yearNow = new Date().getFullYear();
    yearNow = (yearNow <= 1000)? 1000 : ((yearNow >= 9999)? 9999 : yearNow);
    var yearMin = (yearNow - this.yearFall >= 1000) ? yearNow - this.yearFall : 1000;
    var yearMax = (yearNow + this.yearFall <= 9999) ? yearNow + this.yearFall : 9999;
        yearMin = (yearMax == 9999) ? yearMax-this.yearFall*2 : yearMin;
        yearMax = (yearMin == 1000) ? yearMin+this.yearFall*2 : yearMax;
    for (var i=yearMin; i<=yearMax; i++) this.yearOption += "<option value='"+i+"'>"+i+"年</option>";
}   

function writeIframe()
{
    var strIframe = "<html><head><meta http-equiv='Content-Type' content='text/html; charset=gb2312'><style>"+
    "*{font-size: 12px; font-family: 宋体}"+
    ".bg{  color: "+ WebCalendar.lightColor +"; cursor: default; background-color: "+ WebCalendar.darkColor +";}"+
    "table#tableMain{ width: "+ (cal_Width+2).toString() +"px; height: 180px;}"+
    "table#tableWeek td{ width:14%;color: "+ WebCalendar.lightColor +";}"+
    "table#tableDay  td{ width:14%;font-weight: bold;}"+
    "td#meizzYearHead, td#meizzYearMonth{color: "+ WebCalendar.wordColor +"}"+
    ".out { text-align: center; border-top: 1px solid "+ WebCalendar.DarkBorder +"; border-left: 1px solid "+ WebCalendar.DarkBorder +";"+
    "border-right: 1px solid "+ WebCalendar.lightColor +"; border-bottom: 1px solid "+ WebCalendar.lightColor +";}"+
    ".over{ text-align: center; border-top: 1px solid #FFFFFF; border-left: 1px solid #FFFFFF;"+
    "border-bottom: 1px solid "+ WebCalendar.DarkBorder +"; border-right: 1px solid "+ WebCalendar.DarkBorder +"}"+
    "input{ border: 1px solid "+ WebCalendar.darkColor +"; padding-top: 1px; height: 18px; cursor: hand;"+
    "       color:"+ WebCalendar.wordColor +"; background-color: "+ WebCalendar.btnBgColor +"}"+
    "</style></head><body onselectstart='return false' style='margin: 0px' οncοntextmenu='return false'><form name=meizz>";

    if (WebCalendar.drag){ strIframe += "<scr"+"ipt language=javascript>"+
    "var drag=false, cx=0, cy=0, o = parent.WebCalendar.calendar; function document.onmousemove(){"+
    "if(parent.WebCalendar.drag && drag){if(o.style.left=='')o.style.left=0; if(o.style.top=='')o.style.top=0;"+
    "o.style.left = parseInt(o.style.left) + window.event.clientX-cx;"+
    "o.style.top  = parseInt(o.style.top)  + window.event.clientY-cy;}}"+
    "function document.onkeydown(){ switch(window.event.keyCode){  case 27 : parent.hiddenCalendar(); break;"+
    "case 37 : parent.prevM(); break; case 38 : parent.prevY(); break; case 39 : parent.nextM(); break; case 40 : parent.nextY(); break;"+
    "case 84 : document.forms[0].today.click(); break;} " +
    "try{window.event.keyCode = 0; window.event.returnValue= false;}catch(ee){}}"+
    "function dragStart(){cx=window.event.clientX; cy=window.event.clientY; drag=true;}</scr"+"ipt>"}

    strIframe += "<table id=tableMain class=bg border=0 cellspacing=2 cellpadding=0>"+
    "<tr><td width='"+ cal_Width +"px' height='19px' bgcolor='"+ WebCalendar.lightColor +"'>"+
    "    <table width='"+ cal_Width +"px' id='tableHead' border='0' cellspacing='1' cellpadding='0'><tr align='center'>"+
    "    <td width='10%' height='19px' class='bg' title='向前翻 1 月
快捷键:←' style='cursor: hand' οnclick='parent.prevM()'><b><</b></td>"+
    "    <td width='45%' id=meizzYearHead "+
    "        οnmοuseοver='this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor'"+
    "        οnmοuseοut='this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor'>" + 
    "<select name=tmpYearSelect  οnblur='parent.hiddenSelect(this)' style='width:100%;'"+
    "        οnchange='parent.WebCalendar.thisYear =this.value; parent.hiddenSelect(this); parent.writeCalendar();'>";
    
//    var yearNow = new Date().getFullYear();
//    yearNow = (yearNow <= 1000)? 1000 : ((yearNow >= 9999)? 9999 : yearNow);
//    var yearMin = (yearNow - WebCalendar.yearFall >= 1000) ? yearNow - WebCalendar.yearFall : 1000;
//    var yearMax = (yearNow + WebCalendar.yearFall <= 9999) ? yearNow + WebCalendar.yearFall : 9999;
//        yearMin = (yearMax == 9999) ? yearMax-WebCalendar.yearFall*2 : yearMin;
//        yearMax = (yearMin == 1000) ? yearMin+WebCalendar.yearFall*2 : yearMax;
//    for (var i=yearMin; i<=yearMax; i++) strIframe += "<option value='"+i+"'>"+i+"年</option>";

    strIframe += WebCalendar.yearOption + "</select>"+
    "</td>"+
    "    <td width='35%' id=meizzYearMonth "+
    "        οnmοuseοver='this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor'"+
    "        οnmοuseοut='this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor'>" +
    "<select name=tmpMonthSelect οnblur='parent.hiddenSelect(this)' style='width:100%;'" +    
    "        οnchange='parent.WebCalendar.thisMonth=this.value; parent.hiddenSelect(this); parent.writeCalendar();'>";
    for (var i=1; i<13; i++) strIframe += "<option value='"+i+"'>"+i+"月</option>";
    strIframe += "</select>"+
    "</td>"+
    "    <td width='10%' class=bg title='向后翻 1 月
快捷键:→' οnclick='parent.nextM()' style='cursor: hand'><b>></b></td></tr></table>"+
    "</td></tr><tr><td height='20px'>"+
    "<table id=tableWeek border=1 width='"+ cal_Width +"px' cellpadding=0 cellspacing=0 ";
    if(WebCalendar.drag){strIframe += "οnmοusedοwn='dragStart()' οnmοuseup='drag=false' ";}
    strIframe += " borderColorLight='"+ WebCalendar.darkColor +"' borderColorDark='"+ WebCalendar.lightColor +"'>"+
    "    <tr align=center><td height='20px'>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></table>"+
    "</td></tr><tr><td valign=top width='"+ cal_Width +"px' bgcolor='"+ WebCalendar.lightColor +"'>"+
    "    <table id=tableDay height='120px' width='"+ cal_Width +"px' border=0 cellspacing=1 cellpadding=0>";
         for(var x=0; x<5; x++){
           strIframe += "<tr>";
           for(var y=0; y<7; y++)
             strIframe += "<td class=out id='meizzDay"+ (x*7+y) +"'></td>"; 
           strIframe += "</tr>";
         }
         strIframe += "<tr>";
         for(var x=35; x<WebCalendar.dayShow; x++)
           strIframe += "<td class=out id='meizzDay"+ x +"'></td>";
         strIframe +="<td colspan="+(42-WebCalendar.dayShow).toString()+" class=out style='text-align:center;' title='"+ WebCalendar.regInfo +"'>" + 
         "<input style=' background-color: " + WebCalendar.btnBgColor +";cursor: hand; padding-top: 2px; width: 44%; height: 100%;' οnfοcus='this.blur()'"+
         " type=button value='清空' οnclick='parent.WebCalendar.objExport.value=\"\";parent.hiddenCalendar()'>" + 
         " " + 
         "<input style=' background-color: " + WebCalendar.btnBgColor +";cursor: hand; padding-top: 2px; width: 43%; height: 100%;' οnfοcus='this.blur()'"+
         " type=button value='关闭' οnclick='parent.hiddenCalendar()'>" + 
         "</td></tr></table>"+
    "</td></tr><tr><td height='20px' width='"+ cal_Width +"px' bgcolor='"+ WebCalendar.lightColor +"'>"+
    "    <table border=0 cellpadding=1 cellspacing=0 width='"+ cal_Width +"px'>"+
    "    <tr><td><input name=prevYear title='向前翻 1 年
快捷键:↑' οnclick='parent.prevY()' type=button value='<<'"+
    "    οnfοcus='this.blur()' style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==1000)'><input"+
    "    οnfοcus='this.blur()' name=prevMonth title='向前翻 1 月
快捷键:←' οnclick='parent.prevM()' type=button value='< '>"+
    "    </td><td align=center><input name=today type=button value='Today' οnfοcus='this.blur()' style='width: 50px;' title='当前日期
快捷键:T'"+
    "    οnclick=\"parent.returnDate(new Date().getDate() +'/'+ (new Date().getMonth() +1) +'/'+ new Date().getFullYear())\">"+
    "    </td><td align=right><input title='向后翻 1 月
快捷键:→' name=nextMonth οnclick='parent.nextM()' type=button value=' >'"+
    "    οnfοcus='this.blur()'><input name=nextYear title='向后翻 1 年
快捷键:↓' οnclick='parent.nextY()' type=button value='>>'"+
    "    οnfοcus='this.blur()' style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==9999)'></td></tr></table>"+
    "</td></tr><table></form></body></html>";
    with(WebCalendar.iframe)
    {
        document.writeln(strIframe); document.close();
        for(var i=0; i<WebCalendar.dayShow; i++)
        {
            WebCalendar.dayObj[i] = eval("meizzDay"+ i);
            WebCalendar.dayObj[i].onmouseover = dayMouseOver;
            WebCalendar.dayObj[i].onmouseout  = dayMouseOut;
            WebCalendar.dayObj[i].onclick     = returnDate;
        }
    }
}

function calendar() //主调函数
{
    var e = window.event.srcElement;   writeIframe();
    var o = WebCalendar.calendar.style; WebCalendar.eventSrc = e;
	if (arguments.length == 0) WebCalendar.objExport = e;
    else WebCalendar.objExport = eval(arguments[0]);

    WebCalendar.iframe.tableWeek.style.cursor = WebCalendar.drag ? "move" : "default";
	var t = e.offsetTop,  h = e.clientHeight, l = e.offsetLeft, p = e.type;
	while (e = e.offsetParent){t += e.offsetTop; l += e.offsetLeft;}
    o.display = ""; WebCalendar.iframe.document.body.focus();
    var cw = WebCalendar.calendar.clientWidth, ch = WebCalendar.calendar.clientHeight;
    var dw = document.body.clientWidth, dl = document.body.scrollLeft, dt = document.body.scrollTop;
    
    if (document.body.clientHeight + dt - t - h >= ch) o.top = (p=="image")? t + h : t + h + 6;
    else o.top  = (t - dt < ch) ? ((p=="image")? t + h : t + h + 6) : t - ch;
    if (dw + dl - l >= cw) o.left = l; else o.left = (dw >= cw) ? dw - cw + dl : dl;

    if  (!WebCalendar.timeShow) WebCalendar.dateReg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/;
    else WebCalendar.dateReg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/;

    try{
        if (WebCalendar.objExport.value.trim() != ""){
            WebCalendar.dateStyle = WebCalendar.objExport.value.trim().match(WebCalendar.dateReg);
            if (WebCalendar.dateStyle == null)
            {
                WebCalendar.thisYear   = new Date().getFullYear();
                WebCalendar.thisMonth  = new Date().getMonth()+ 1;
                WebCalendar.thisDay    = new Date().getDate();
                alert("原文本框里的日期有错误!\n可能与你定义的显示时分秒有冲突!");
                writeCalendar(); return false;
            }
            else
            {
                WebCalendar.thisYear   = parseInt(WebCalendar.dateStyle[1], 10);
                WebCalendar.thisMonth  = parseInt(WebCalendar.dateStyle[3], 10);
                WebCalendar.thisDay    = parseInt(WebCalendar.dateStyle[4], 10);
                WebCalendar.inputDate  = parseInt(WebCalendar.thisDay, 10) +"/"+ parseInt(WebCalendar.thisMonth, 10) +"/"+ 
                parseInt(WebCalendar.thisYear, 10); writeCalendar();
            }
        } else {
          WebCalendar.thisYear   = new Date().getFullYear();
          WebCalendar.thisMonth  = new Date().getMonth()+ 1;
          WebCalendar.thisDay    = new Date().getDate();
          writeCalendar();
        }
    } catch(e) {
      WebCalendar.thisYear   = new Date().getFullYear();
      WebCalendar.thisMonth  = new Date().getMonth()+ 1;
      WebCalendar.thisDay    = new Date().getDate();
      writeCalendar();
    }
}

function funMonthSelect() //月份的下拉框
{
    var m = isNaN(parseInt(WebCalendar.thisMonth, 10)) ? new Date().getMonth() + 1 : parseInt(WebCalendar.thisMonth);
    var e = WebCalendar.iframe.document.forms[0].tmpMonthSelect;
    e.value = m; //e.focus(); 
    //window.status = e.style.left;
}

function funYearSelect() //年份的下拉框
{
    var e = WebCalendar.iframe.document.forms[0].tmpYearSelect;
    var y = isNaN(parseInt(WebCalendar.thisYear, 10)) ? new Date().getFullYear() : parseInt(WebCalendar.thisYear);
    e.value = y; //e.focus();
//    if(e.value == "")
//    {
//      e.value = new Date().getFullYear();
//      WebCalendar.thisYear = e.value;
//    }
}

function prevM()  //往前翻月份
{
    WebCalendar.thisDay = 1;
    if (WebCalendar.thisMonth==1)
    {
        WebCalendar.thisYear--;
        WebCalendar.thisMonth=13;
    }
    WebCalendar.thisMonth--; writeCalendar();
}

function nextM()  //往后翻月份
{
    WebCalendar.thisDay = 1;
    if (WebCalendar.thisMonth==12)
    {
        WebCalendar.thisYear++;
        WebCalendar.thisMonth=0;
    }
    WebCalendar.thisMonth++; writeCalendar();
}
function prevY(){WebCalendar.thisDay = 1; WebCalendar.thisYear--; writeCalendar();}//往前翻 Year
function nextY(){WebCalendar.thisDay = 1; WebCalendar.thisYear++; writeCalendar();}//往后翻 Year
function hiddenSelect(e){
  //for(var i=e.options.length; i>-1; i--)e.options.remove(i); e.style.display="none";
}
function getObjectById(id){ if(document.all) return(eval("document.all."+ id)); return(eval(id)); }
function hiddenCalendar(){getObjectById("meizzCalendarLayer").style.display = "none";};
function appendZero(n){return(("00"+ n).substr(("00"+ n).length-2));}//日期自动补零程序
function String.prototype.trim(){return this.replace(/(^\s*)|(\s*$)/g,"");}
function dayMouseOver()
{
    this.className = "over";
    this.style.backgroundColor = WebCalendar.darkColor;
    if(WebCalendar.day[this.id.substr(8)].split("/")[1] == WebCalendar.thisMonth)
    this.style.color = WebCalendar.lightColor;
}
function dayMouseOut()
{
    this.className = "out"; var d = WebCalendar.day[this.id.substr(8)], a = d.split("/");
    this.style.removeAttribute('backgroundColor');
    if(a[1] == WebCalendar.thisMonth && d != WebCalendar.today)
    {
        if(WebCalendar.dateStyle && a[0] == parseInt(WebCalendar.dateStyle[4], 10))
        this.style.color = WebCalendar.lightColor;
        this.style.color = WebCalendar.wordColor;
    }
}
function writeCalendar() //对日历显示的数据的处理程序
{
    var y = WebCalendar.thisYear;
    var m = WebCalendar.thisMonth; 
    var d = WebCalendar.thisDay;
    WebCalendar.daysMonth[1] = (0==y%4 && (y%100!=0 || y%400==0)) ? 29 : 28;
    if (!(y<=9999 && y >= 1000 && parseInt(m, 10)>0 && parseInt(m, 10)<13 && parseInt(d, 10)>0)){
        alert("对不起,你输入了错误的日期!");
        WebCalendar.thisYear   = new Date().getFullYear();
        WebCalendar.thisMonth  = new Date().getMonth()+ 1;
        WebCalendar.thisDay    = new Date().getDate(); }
    y = WebCalendar.thisYear;
    m = WebCalendar.thisMonth;
    d = WebCalendar.thisDay;
    
    funYearSelect(parseInt(y, 10));
    funMonthSelect(parseInt(m,10));
    //WebCalendar.iframe.meizzYearHead.innerText  = y +" 年";
    //WebCalendar.iframe.meizzYearMonth.innerText = parseInt(m, 10) +" 月";
    WebCalendar.daysMonth[1] = (0==y%4 && (y%100!=0 || y%400==0)) ? 29 : 28; //闰年二月为29天
    var w = new Date(y, m-1, 1).getDay();
    var prevDays = m==1  ? WebCalendar.daysMonth[11] : WebCalendar.daysMonth[m-2];
    for(var i=(w-1); i>=0; i--) //这三个 for 循环为日历赋数据源(数组 WebCalendar.day)格式是 d/m/yyyy
    {
        WebCalendar.day[i] = prevDays +"/"+ (parseInt(m, 10)-1) +"/"+ y;
        if(m==1) WebCalendar.day[i] = prevDays +"/"+ 12 +"/"+ (parseInt(y, 10)-1);
        prevDays--;
    }
    for(var i=1; i<=WebCalendar.daysMonth[m-1]; i++) WebCalendar.day[i+w-1] = i +"/"+ m +"/"+ y;
    for(var i=1; i<WebCalendar.dayShow-w-WebCalendar.daysMonth[m-1]+1; i++)
    {
        WebCalendar.day[WebCalendar.daysMonth[m-1]+w-1+i] = i +"/"+ (parseInt(m, 10)+1) +"/"+ y;
        if(m==12) WebCalendar.day[WebCalendar.daysMonth[m-1]+w-1+i] = i +"/"+ 1 +"/"+ (parseInt(y, 10)+1);
    }
    for(var i=0; i<WebCalendar.dayShow; i++)    //这个循环是根据源数组写到日历里显示
    {
        var a = WebCalendar.day[i].split("/");
        WebCalendar.dayObj[i].innerText    = a[0];
        WebCalendar.dayObj[i].title        = a[2] +"-"+ appendZero(a[1]) +"-"+ appendZero(a[0]);
        WebCalendar.dayObj[i].bgColor      = WebCalendar.dayBgColor;
        WebCalendar.dayObj[i].style.color  = WebCalendar.wordColor;
        if ((i<10 && parseInt(WebCalendar.day[i], 10)>20) || (i>27 && parseInt(WebCalendar.day[i], 10)<12))
            WebCalendar.dayObj[i].style.color = WebCalendar.wordDark;
        if (WebCalendar.inputDate==WebCalendar.day[i])    //设置输入框里的日期在日历上的颜色
        {WebCalendar.dayObj[i].bgColor = WebCalendar.darkColor; WebCalendar.dayObj[i].style.color = WebCalendar.lightColor;}
        if (WebCalendar.day[i] == WebCalendar.today)      //设置今天在日历上反应出来的颜色
        {WebCalendar.dayObj[i].bgColor = WebCalendar.todayColor; WebCalendar.dayObj[i].style.color = WebCalendar.lightColor;}
    }
}
function returnDate() //根据日期格式等返回用户选定的日期
{
    if(WebCalendar.objExport)
    {
        var returnValue;
        var a = (arguments.length==0) ? WebCalendar.day[this.id.substr(8)].split("/") : arguments[0].split("/");
        var d = WebCalendar.format.match(/^(\w{4})(-|\/)(\w{1,2})\2(\w{1,2})$/);
        if(d==null){alert("你设定的日期输出格式不对!\r\n\r\n请重新定义 WebCalendar.format !"); return false;}
        var flag = d[3].length==2 || d[4].length==2; //判断返回的日期格式是否要补零
        returnValue = flag ? a[2] +d[2]+ appendZero(a[1]) +d[2]+ appendZero(a[0]) : a[2] +d[2]+ a[1] +d[2]+ a[0];
        if(WebCalendar.timeShow)
        {
            var h = new Date().getHours(), m = new Date().getMinutes(), s = new Date().getSeconds();
            returnValue += flag ? " "+ appendZero(h) +":"+ appendZero(m) +":"+ appendZero(s) : " "+  h  +":"+ m +":"+ s;
        }
        WebCalendar.objExport.value = returnValue;
        hiddenCalendar();
    }
}
//-->
		</script>



2

<script language="javascript">
			//  主调用函数是 setday(this,[object])和setday(this),[object]是控件输出的控件名,举两个例子:
//  一、<input name=txt><input type=button value=setday οnclick="setday(this,document.all.txt)">
//  二、<input οnfοcus="setday(this)">

var bMoveable=true;
var strFrame;		
document.writeln('<iframe id=endDateLayer frameborder=0 style="position: absolute; z-index: 9998; display: none"></iframe>');
strFrame='<style>';
strFrame+='INPUT.button{BORDER-RIGHT: #63A3E9 1px solid;BORDER-TOP: #63A3E9 1px solid;BORDER-LEFT: #63A3E9 1px solid;';
strFrame+='BORDER-BOTTOM: #63A3E9 1px solid;BACKGROUND-COLOR: #63A3E9;font-family:宋体;}';
strFrame+='TD{FONT-SIZE: 9pt;font-family:宋体;}';
strFrame+='</style>';
strFrame+='<scr' + 'ipt>';
strFrame+='var datelayerx,datelayery;';
strFrame+='var bDrag;';
strFrame+='function document.onmousemove()';
strFrame+='{if(bDrag && window.event.button==1)';
strFrame+='	{var DateLayer=parent.document.all.endDateLayer.style;';
strFrame+='		DateLayer.posLeft += window.event.clientX-datelayerx;';
strFrame+='		DateLayer.posTop += window.event.clientY-datelayery;}}';
strFrame+='function DragStart()';
strFrame+='{var DateLayer=parent.document.all.endDateLayer.style;';
strFrame+='	datelayerx=window.event.clientX;';
strFrame+='	datelayery=window.event.clientY;';
strFrame+='	bDrag=true;}';
strFrame+='function DragEnd(){';
strFrame+='	bDrag=false;}';
strFrame+='</scr' + 'ipt>';
strFrame+='<div style="z-index:9999;position: absolute; left:0; top:0;" onselectstart="return false">';
strFrame+='<span id=tmpSelectYearLayer  style="z-index: 9999;position: absolute;top: 3; left: 19;display: none"></span>';
strFrame+='<span id=tmpSelectMonthLayer  style="z-index: 9999;position: absolute;top: 3; left: 78;display: none"></span>';
strFrame+='<span id=tmpSelectHourLayer  style="z-index: 9999;position: absolute;top: 188; left: 56;display: none"></span>';
strFrame+='<span id=tmpSelectMinuteLayer style="z-index:9999;position:absolute;top: 188; left: 107;display: none"></span>';
strFrame+='<table border=1 cellspacing=0 cellpadding=0 width=142 height=160 bordercolor=#63A3E9 bgcolor=#63A3E9 >';
strFrame+='    <tr><td width=142 height=23  bgcolor=#FFFFFF>';
strFrame+='        <table border=0 cellspacing=1 cellpadding=0 width=158  height=23>';
strFrame+='            <tr align=center >';
strFrame+='                <td width=16 align=center bgcolor=#63A3E9 style="font-size:12px;cursor: hand;color: #ffffff" ';
strFrame+='					   οnclick="parent.meizzPrevM()" title="向前翻 1 月" ><b ><</b></td>';
strFrame+='				   <td width=60 align="center" bgcolor="#63A3E9"  style="font-size:12px;cursor:hand" ';
strFrame+='				       οnmοuseοver="style.backgroundColor=\'#aaccf3\'"';
strFrame+='					   οnmοuseοut="style.backgroundColor=\'#63A3E9\'" ';
strFrame+='					   οnclick="parent.tmpSelectYearInnerHTML(this.innerText.substring(0,4))" ';
strFrame+='					   title="点击这里选择年份"><span  id=meizzYearHead></span></td>';
strFrame+='				   <td width=48 align="center" style="font-size:12px;font-color: #ffffff;cursor:hand" ';
strFrame+='					   bgcolor="#63A3E9" οnmοuseοver="style.backgroundColor=\'#aaccf3\'" ';
strFrame+='					   οnmοuseοut="style.backgroundColor=\'#63A3E9\'" ';
strFrame+='					   οnclick="parent.tmpSelectMonthInnerHTML(this.innerText.length==3?this.innerText.substring(0,1):this.innerText.substring(0,2))"';
strFrame+='					   title="点击这里选择月份"><span id=meizzMonthHead ></span></td>';
strFrame+='				   <td width=16 bgcolor=#63A3E9 align=center style="font-size:12px;cursor: hand;color: #ffffff" ';
strFrame+='					   οnclick="parent.meizzNextM()" title="向后翻 1 月" ><b >></b></td>';
strFrame+='			   </tr>';
strFrame+='		   </table></td></tr>';
strFrame+='	   <tr><td width=142 height=18 >';
strFrame+='		   <table border=0 cellspacing=0 cellpadding=2 bgcolor=#63A3E9 ' + (bMoveable? 'οnmοusedοwn="DragStart()" οnmοuseup="DragEnd()"':'');
strFrame+='				BORDERCOLORLIGHT=#63A3E9 BORDERCOLORDARK=#FFFFFF width=140 height=20  style="cursor:' + (bMoveable ? 'move':'default') + '">';
strFrame+='	   <tr><td style="font-size:12px;color:#ffffff" width=20> 日</td>';
strFrame+='<td style="font-size:12px;color:#FFFFFF" > 一</td><td style="font-size:12px;color:#FFFFFF"> 二</td>';
strFrame+='<td style="font-size:12px;color:#FFFFFF" > 三</td><td style="font-size:12px;color:#FFFFFF" > 四</td>';
strFrame+='<td style="font-size:12px;color:#FFFFFF" > 五</td><td style="font-size:12px;color:#FFFFFF" > 六</td></tr>';
strFrame+='</table></td></tr>';
strFrame+='  <tr ><td width=142 height=120 >';
strFrame+='    <table border=1 cellspacing=2 cellpadding=2 BORDERCOLORLIGHT=#63A3E9 BORDERCOLORDARK=#FFFFFF bgcolor=#fff8ec width=140 height=120 >';
var n=0; for (j=0;j<5;j++){ strFrame+= ' <tr align=center >'; for (i=0;i<7;i++){
strFrame+='<td width=20 height=20 id=meizzDay'+n+' style="font-size:12px" οnclick=parent.meizzDayClick(this.innerText,0)></td>';n++;}
strFrame+='</tr>';}
strFrame+='      <tr align=center >';
for (i=35;i<37;i++)strFrame+='<td width=20 height=20 id=meizzDay'+i+' style="font-size:12px"  οnclick="parent.meizzDayClick(this.innerText,0)"></td>';
strFrame+='        <td colspan=5 align=right style="color:#1478eb"><span οnclick="parent.setNull()" style="font-size:12px;cursor: hand"';
strFrame+='         οnmοuseοver="style.color=\'#ff0000\'" οnmοuseοut="style.color=\'#1478eb\'" title="将日期置空">置空</span>  <span οnclick="parent.meizzToday()" style="font-size:12px;cursor: hand"';
strFrame+='         οnmοuseοver="style.color=\'#ff0000\'" οnmοuseοut="style.color=\'#1478eb\'" title="当前日期时间">当前</span>  <span style="cursor:hand" id=evaAllOK οnmοuseοver="style.color=\'#ff0000\'" οnmοuseοut="style.color=\'#1478eb\'"  οnclick="parent.closeLayer()" title="关闭日历">关闭 </span></td></tr>';
strFrame+='    </table></td></tr><tr ><td >';
strFrame+='        <table border=0 cellspacing=1 cellpadding=0 width=100%  bgcolor=#FFFFFF height=22 >';
strFrame+='          <tr bgcolor="#63A3E9"><td id=bUseTimeLayer width=55  style="cursor:hand" title="点击这里启用/禁用时间"';
strFrame+='				οnmοuseοver="style.backgroundColor=\'#aaccf3\'" align=center οnmοuseοut="style.backgroundColor=\'#63A3E9\'"';
strFrame+='				 οnclick="parent.UseTime(this)">';
strFrame+=' <span></span></td>';
strFrame+='             <td style="cursor:hand" οnclick="parent.tmpSelectHourInnerHTML(this.innerText.length==3?this.innerText.substring(0,1):this.innerText.substring(0,2))"';
strFrame+=' οnmοuseοver="style.backgroundColor=\'#aaccf3\'" οnmοuseοut="style.backgroundColor=\'#63A3E9\'"';
strFrame+=' title="点击这里选择时间" align=center width=50>' ;
strFrame+='					<span id=meizzHourHead></span></td>';
strFrame+='             <td style="cursor:hand" οnclick="parent.tmpSelectMinuteInnerHTML(this.innerText.length==3?this.innerText.substring(0,1):this.innerText.substring(0,2))"';
strFrame+=' οnmοuseοver="style.backgroundColor=\'#aaccf3\'" οnmοuseοut="style.backgroundColor=\'#63A3E9\'"';
strFrame+=' title="点击这里选择时间" align=center width=50>' ;
strFrame+='					<span id=meizzMinuteHead></span></td>';
strFrame+='			 </tr></table></td></tr></table></div>';

window.frames.endDateLayer.document.writeln(strFrame);
window.frames.endDateLayer.document.close();		//解决ie进度条不结束的问题


//==================================================== WEB 页面显示部分 ======================================================
var outObject;
var outButton;		//点击的按钮

var outDate="";		//存放对象的日期

var odatelayer=window.frames.endDateLayer.document.all;		//存放日历对象
var odatelayer=window.endDateLayer.document.all;
var bUseTime=false;		//是否使用时间
var bCanUseTime=true;	//能否开启关闭时间

//odatelayer.bUseTimeLayer.innerText="NO";
bImgSwitch();
odatelayer.bUseTimeLayer.innerHTML=bImg;

//设置日期
//tt按钮,obj输出,hasTime是否带时分秒,canUseTime能否开启关闭时分秒
//added by xgzhang in 2005-09-30
function setTime(tt,obj,hasTime,canUseTime)
{
	if (arguments.length >  4){alert("对不起!传入本控件的参数太多!");return;}
	if (arguments.length == 0){alert("对不起!您没有传回本控件任何参数!");return;}
	var dads  = document.all.endDateLayer.style;
	var th = tt;
	var ttop  = tt.offsetTop;     //TT控件的定位点高

	var thei  = tt.clientHeight;  //TT控件本身的高
	var tleft = tt.offsetLeft;    //TT控件的定位点宽

	var ttyp  = tt.type;          //TT控件的类型

	while (tt = tt.offsetParent){ttop+=tt.offsetTop; tleft+=tt.offsetLeft;}
	dads.top  = (ttyp=="image")? ttop+thei : ttop+thei+6;
	dads.left = tleft;
	outObject = (arguments.length == 1) ? th : obj;
	outButton = (arguments.length == 1) ? null : th;	//设定外部点击的按钮

	bCanUseTime = canUseTime;
	
	//根据当前输入框的日期显示日历的年月

	var reg = /^(\d+)-(\d{1,2})-(\d{1,2})/;		//不含时间
	var r = outObject.value.match(reg);	
	if(r!=null){
		r[2]=r[2]-1; 
		var d=new Date(r[1],r[2],r[3]);
		if(d.getFullYear()==r[1] && d.getMonth()==r[2] && d.getDate()==r[3])
		{
			outDate=d;
			parent.meizzTheYear = r[1];
			parent.meizzTheMonth = r[2];
			parent.meizzTheDate = r[3];
		}
		else 
		{
			outDate="";
		}
		meizzSetDay(r[1],r[2]+1);
		
	}
	else{
		outDate="";
		meizzSetDay(new Date().getFullYear(), new Date().getMonth() + 1);
	}
	dads.display = '';

	if (outObject.value.length>10 || hasTime)
	{
		bUseTime=true;
		bImgSwitch();
		odatelayer.bUseTimeLayer.innerHTML=bImg;
		meizzWriteHead(meizzTheYear,meizzTheMonth);
	}
	else
	{
		bUseTime=false;
		bImgSwitch();
		odatelayer.bUseTimeLayer.innerHTML=bImg;
		meizzWriteHead(meizzTheYear,meizzTheMonth);
	}

	try
	{
		event.returnValue=false;
	}
	catch (e)
	{
		//此处排除错误,错误原因暂未找到。

	}
}

function setday(tt,obj) //主调函数
{
	if (arguments.length >  2){alert("对不起!传入本控件的参数太多!");return;}
	if (arguments.length == 0){alert("对不起!您没有传回本控件任何参数!");return;}
	var dads  = document.all.endDateLayer.style;
	var th = tt;
	var ttop  = tt.offsetTop;     //TT控件的定位点高

	var thei  = tt.clientHeight;  //TT控件本身的高
	var tleft = tt.offsetLeft;    //TT控件的定位点宽

	var ttyp  = tt.type;          //TT控件的类型

	while (tt = tt.offsetParent){ttop+=tt.offsetTop; tleft+=tt.offsetLeft;}
	dads.top  = (ttyp=="image")? ttop+thei : ttop+thei+6;
	dads.left = tleft;
	outObject = (arguments.length == 1) ? th : obj;
	outButton = (arguments.length == 1) ? null : th;	//设定外部点击的按钮



	//根据当前输入框的日期显示日历的年月

	var reg = /^(\d+)-(\d{1,2})-(\d{1,2})/;		//不含时间
	var r = outObject.value.match(reg);	
	if(r!=null){
		r[2]=r[2]-1; 
		var d=new Date(r[1],r[2],r[3]);
		if(d.getFullYear()==r[1] && d.getMonth()==r[2] && d.getDate()==r[3])
		{
			outDate=d;
			parent.meizzTheYear = r[1];
			parent.meizzTheMonth = r[2];
			parent.meizzTheDate = r[3];
		}
		else 
		{
			outDate="";
		}
		meizzSetDay(r[1],r[2]+1);
		
	}
	else{
		outDate="";
		meizzSetDay(new Date().getFullYear(), new Date().getMonth() + 1);
	}
	dads.display = '';

	//判断初始化时是否使用时间,非严格验证

	if (outObject.value.length>10)
	{
		bUseTime=true;
		bImgSwitch();
		odatelayer.bUseTimeLayer.innerHTML=bImg;
		meizzWriteHead(meizzTheYear,meizzTheMonth);
	}
	else
	{
		bUseTime=false;
		bImgSwitch();
		odatelayer.bUseTimeLayer.innerHTML=bImg;
		meizzWriteHead(meizzTheYear,meizzTheMonth);
	}
	
	/*//判断初始化时是否使用时间,严格验证
	var tmpReg = /^(\d+)-(\d{1,2})-(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})/;
	var tmpR =outObject.value.match(tmpReg);
	if (tmpR!=null)
	{
		tmpR[2]=tmpR[2]-1;
		var tmpD=new Date(tmpR[1],tmpR[2],tmpR[3],tmpR[4],tmpR[5],tmpR[6]);
		if(tmpD.getFullYear()==tmpR[1] && tmpD.getMonth()==tmpR[2] && tmpD.getDate()==tmpR[3] && tmpD.getHours()==tmpR[4] && tmpD.getMinutes()==tmpR[5] && tmpD.getSeconds()==tmpR[6])
		{
			bUseTime=true;
			meizzWriteHead(meizzTheYear,meizzTheMonth);
			showLayer();
			//odatelayer.bUseTimeLayer.innerText="YES";
		}
	}*/

	try
	{
		event.returnValue=false;
	}
	catch (e)
	{
		//此处排除错误,错误原因暂未找到。

	}
	//--------------------------------------
	// add by cd.NET 2008-05-28
	if (dads != null) {
        dads.width = '162px';
        dads.height = '211px';
    }
    //--------------------------------------
}

var MonHead = new Array(12);    		   //定义阳历中每个月的最大天数

    MonHead[0] = 31; MonHead[1] = 28; MonHead[2] = 31; MonHead[3] = 30; MonHead[4]  = 31; MonHead[5]  = 30;
    MonHead[6] = 31; MonHead[7] = 31; MonHead[8] = 30; MonHead[9] = 31; MonHead[10] = 30; MonHead[11] = 31;

var meizzTheYear=new Date().getFullYear(); //定义年的变量的初始值

var meizzTheMonth=new Date().getMonth()+1; //定义月的变量的初始值

var meizzTheDate=new Date().getDate();	   //定义日的变量的初始值	
var meizzTheHour=new Date().getHours();	   //定义小时变量的初始值

var meizzTheMinute=new Date().getMinutes();//定义分钟变量的初始值

var meizzWDay=new Array(37);               //定义写日期的数组

function document.onclick() //任意点击时关闭该控件	//ie6的情况可以由下面的切换焦点处理代替

{ 
  with(window.event)
  { if (srcElement != outObject && srcElement != outButton)
    closeLayer();
  }
}

function document.onkeyup()		//按Esc键关闭,切换焦点关闭
  {
    if (window.event.keyCode==27){
		if(outObject)outObject.blur();
		closeLayer();
	}
	else if(document.activeElement)
		if(document.activeElement != outObject && document.activeElement != outButton)
		{
			closeLayer();
		}
  }

function meizzWriteHead(yy,mm)  //往 head 中写入当前的年与月

  {
	odatelayer.meizzYearHead.innerText  = yy + " 年";
    odatelayer.meizzMonthHead.innerText = format(mm) + " 月";
	//插入当前小时、分
	odatelayer.meizzHourHead.innerText=bUseTime?(meizzTheHour+" 时"):""; 
	odatelayer.meizzMinuteHead.innerText=bUseTime?(meizzTheMinute+" 分"):"";

  }

function tmpSelectYearInnerHTML(strYear) //年份的下拉框
{
  if (strYear.match(/\D/)!=null){alert("年份输入参数不是数字!");return;}
  var m = (strYear) ? strYear : new Date().getFullYear();
  if (m < 1000 || m > 9999) {alert("年份值不在 1000 到 9999 之间!");return;}
  var n = m - 50;
  if (n < 1000) n = 1000;
  if (n + 101 > 9999) n = 9974;
  var s = " <select  name=tmpSelectYear style='font-size: 12px' "
     s += "οnblur='document.all.tmpSelectYearLayer.style.display=\"none\"' "
     s += "οnchange='document.all.tmpSelectYearLayer.style.display=\"none\";"
     s += "parent.meizzTheYear = this.value; parent.meizzSetDay(parent.meizzTheYear,parent.meizzTheMonth)'>\r\n";
  var selectInnerHTML = s;
  for (var i = n; i < n + 101; i++)
  {
    if (i == m)
       {selectInnerHTML += "<option  value='" + i + "' selected>" + i + "年" + "</option>\r\n";}
    else {selectInnerHTML += "<option  value='" + i + "'>" + i + "年" + "</option>\r\n";}
  }
  selectInnerHTML += "</select>";
  odatelayer.tmpSelectYearLayer.style.display="";
  odatelayer.tmpSelectYearLayer.innerHTML = selectInnerHTML;
  odatelayer.tmpSelectYear.focus();
}

function tmpSelectMonthInnerHTML(strMonth) //月份的下拉框
{
  if (strMonth.match(/\D/)!=null){alert("月份输入参数不是数字!");return;}
  var m = (strMonth) ? strMonth : new Date().getMonth() + 1;
  var s = "   <select  name=tmpSelectMonth style='font-size: 12px' "
     s += "οnblur='document.all.tmpSelectMonthLayer.style.display=\"none\"' "
     s += "οnchange='document.all.tmpSelectMonthLayer.style.display=\"none\";"
     s += "parent.meizzTheMonth = this.value; parent.meizzSetDay(parent.meizzTheYear,parent.meizzTheMonth)'>\r\n";
  var selectInnerHTML = s;
  for (var i = 1; i < 13; i++)
  {
    if (i == m)
       {selectInnerHTML += "<option  value='"+i+"' selected>"+i+"月"+"</option>\r\n";}
    else {selectInnerHTML += "<option  value='"+i+"'>"+i+"月"+"</option>\r\n";}
  }
  selectInnerHTML += "</select>";
  odatelayer.tmpSelectMonthLayer.style.display="";
  odatelayer.tmpSelectMonthLayer.innerHTML = selectInnerHTML;
  odatelayer.tmpSelectMonth.focus();
}


/***** 增加 小时、分钟 ***/
function tmpSelectHourInnerHTML(strHour) //小时的下拉框
{
  if (!bUseTime){return;}

  if (strHour.match(/\D/)!=null){alert("小时输入参数不是数字!");return;}
  var m = (strHour) ? strHour : new Date().getHours();
  var s = " <select  name=tmpSelectHour style='font-size: 12px' "      
      s += "οnblur='document.all.tmpSelectHourLayer.style.display=\"none\"' "
      s += "οnchange='document.all.tmpSelectHourLayer.style.display=\"none\";"
      s += "parent.meizzTheHour = this.value; parent.evaSetTime(parent.meizzTheHour,parent.meizzTheMinute);'>\r\n";
  var selectInnerHTML = s;
  for (var i = 0; i < 24; i++)
  {
    if (i == m)
       {selectInnerHTML += "<option  value='"+i+"' selected> "+i+" </option>\r\n";}
    else {selectInnerHTML += "<option  value='"+i+"'> "+i+" </option>\r\n";}
  }
  selectInnerHTML += "</select>";
  odatelayer.tmpSelectHourLayer.style.display="";
  odatelayer.tmpSelectHourLayer.innerHTML = selectInnerHTML;
  odatelayer.tmpSelectHour.focus();
}

function tmpSelectMinuteInnerHTML(strMinute) //分钟的下拉框
{
  if (!bUseTime){return;}

  if (strMinute.match(/\D/)!=null){alert("分钟输入参数不是数字!");return;}
  var m = (strMinute) ? strMinute : new Date().getMinutes();
  var s = " <select  name=tmpSelectMinute style='font-size: 12px' "
     s += "οnblur='document.all.tmpSelectMinuteLayer.style.display=\"none\"' "
     s += "οnchange='document.all.tmpSelectMinuteLayer.style.display=\"none\";"
	 s += "parent.meizzTheMinute = this.value; parent.evaSetTime(parent.meizzTheHour,parent.meizzTheMinute);'>\r\n";
  var selectInnerHTML = s;
  for (var i = 0; i < 60; i++)
  {
    if (i == m)
       {selectInnerHTML += "<option  value='"+i+"' selected> "+i+" </option>\r\n";}
    else {selectInnerHTML += "<option  value='"+i+"'> "+i+" </option>\r\n";}
  }
  selectInnerHTML += "</select>";
  odatelayer.tmpSelectMinuteLayer.style.display="";
  odatelayer.tmpSelectMinuteLayer.innerHTML = selectInnerHTML;
  odatelayer.tmpSelectMinute.focus();
}

function closeLayer()               //这个层的关闭
  {
	var o = document.getElementById("endDateLayer");
	if (o != null)
	{
		o.style.display="none";
	}
  }

function showLayer()               //这个层的关闭
  {
    document.all.endDateLayer.style.display="";
  }

function IsPinYear(year)            //判断是否闰平年

  {
    if (0==year%4&&((year%100!=0)||(year%400==0))) return true;else return false;
  }

function GetMonthCount(year,month)  //闰年二月为29天

  {
    var c=MonHead[month-1];if((month==2)&&IsPinYear(year)) c++;return c;
  }

function GetDOW(day,month,year)     //求某天的星期几

  {
    var dt=new Date(year,month-1,day).getDay()/7; return dt;
  }

function meizzPrevY()  //往前翻 Year
  {
    if(meizzTheYear > 999 && meizzTheYear <10000){meizzTheYear--;}
    else{alert("年份超出范围(1000-9999)!");}
    meizzSetDay(meizzTheYear,meizzTheMonth);
  }
function meizzNextY()  //往后翻 Year
  {
    if(meizzTheYear > 999 && meizzTheYear <10000){meizzTheYear++;}
    else{alert("年份超出范围(1000-9999)!");}
    meizzSetDay(meizzTheYear,meizzTheMonth);
  }
function setNull()   //
{
	outObject.value = '';
	 closeLayer();
}
function meizzToday()  //Today Button
  {
    parent.meizzTheYear = new Date().getFullYear();
    parent.meizzTheMonth = new Date().getMonth()+1;
    parent.meizzTheDate=new Date().getDate();
	parent.meizzTheHour=new Date().getHours();
	parent.meizzTheMinute=new Date().getMinutes();
	var meizzTheSecond=new Date().getSeconds();

	if (meizzTheMonth<10 && meizzTheMonth.length<2)	//格式化成两位数字
	{
		parent.meizzTheMonth="0"+parent.meizzTheMonth;
	}
	if (parent.meizzTheDate<10 && parent.meizzTheDate.length<2)	//格式化成两位数字
	{
		parent.meizzTheDate="0"+parent.meizzTheDate;
	}
    //meizzSetDay(meizzTheYear,meizzTheMonth);
    if(outObject){
		if (bUseTime)
		{
			outObject.value= parent.meizzTheYear + "-" + format( parent.meizzTheMonth) + "-" + 
							format(parent.meizzTheDate) + " " + format(parent.meizzTheHour) + ":" + 
							format(parent.meizzTheMinute) + ":" + format(meizzTheSecond); 
							//注:在这里你可以输出改成你想要的格式
		}
		else
		{
			outObject.value= parent.meizzTheYear + "-" + format( parent.meizzTheMonth) + "-" + 
							format(parent.meizzTheDate); //注:在这里你可以输出改成你想要的格式
		}
    }
    closeLayer();
  }
function meizzPrevM()  //往前翻月份
  {
    if(meizzTheMonth>1){meizzTheMonth--}else{meizzTheYear--;meizzTheMonth=12;}
    meizzSetDay(meizzTheYear,meizzTheMonth);
  }
function meizzNextM()  //往后翻月份
  {
    if(meizzTheMonth==12){meizzTheYear++;meizzTheMonth=1}else{meizzTheMonth++}
    meizzSetDay(meizzTheYear,meizzTheMonth);
  }

function meizzSetDay(yy,mm)   //主要的写程序**********
{
  meizzWriteHead(yy,mm);
  //设置当前年月的公共变量为传入值

  meizzTheYear=yy;
  meizzTheMonth=mm;
  
  for (var i = 0; i < 37; i++){meizzWDay[i]=""};  //将显示框的内容全部清空

  var day1 = 1,day2=1,firstday = new Date(yy,mm-1,1).getDay();  //某月第一天的星期几

  for (i=0;i<firstday;i++)meizzWDay[i]=GetMonthCount(mm==1?yy-1:yy,mm==1?12:mm-1)-firstday+i+1	//上个月的最后几天

  for (i = firstday; day1 < GetMonthCount(yy,mm)+1; i++){meizzWDay[i]=day1;day1++;}
  for (i=firstday+GetMonthCount(yy,mm);i<37;i++){meizzWDay[i]=day2;day2++}
  for (i = 0; i < 37; i++)
  { var da = eval("odatelayer.meizzDay"+i)     //书写新的一个月的日期星期排列

    if (meizzWDay[i]!="")
      { 
		//初始化边框

		da.borderColorLight="#63A3E9";
		da.borderColorDark="#63A3E9";
		da.style.color="#1478eb";
		if(i<firstday)		//上个月的部分
		{
			da.innerHTML="<b><font color=#BCBABC>" + meizzWDay[i] + "</font></b>";
			da.title=(mm==1?12:mm-1) +"月" + meizzWDay[i] + "日";
			da.οnclick=Function("meizzDayClick(this.innerText,-1)");

			if(!outDate)
				da.style.backgroundColor = ((mm==1?yy-1:yy) == new Date().getFullYear() && 
					(mm==1?12:mm-1) == new Date().getMonth()+1 && meizzWDay[i] == new Date().getDate()) ?
					 "#5CEFA0":"#f5f5f5";
			else
			{
				da.style.backgroundColor =((mm==1?yy-1:yy)==outDate.getFullYear() && (mm==1?12:mm-1)== outDate.getMonth() + 1 && 
				meizzWDay[i]==outDate.getDate())? "#84C1FF" :
				(((mm==1?yy-1:yy) == new Date().getFullYear() && (mm==1?12:mm-1) == new Date().getMonth()+1 && 
				meizzWDay[i] == new Date().getDate()) ? "#5CEFA0":"#f5f5f5");
				//将选中的日期显示为凹下去

				if((mm==1?yy-1:yy)==outDate.getFullYear() && (mm==1?12:mm-1)== outDate.getMonth() + 1 && 
				meizzWDay[i]==outDate.getDate())
				{
					da.borderColorLight="#FFFFFF";
					da.borderColorDark="#63A3E9";
				}
			}
		}
		else if (i>=firstday+GetMonthCount(yy,mm))		//下个月的部分
		{
			da.innerHTML="<b><font color=#BCBABC>" + meizzWDay[i] + "</font></b>";
			da.title=(mm==12?1:mm+1) +"月" + meizzWDay[i] + "日";
			da.οnclick=Function("meizzDayClick(this.innerText,1)");
			if(!outDate)
				da.style.backgroundColor = ((mm==12?yy+1:yy) == new Date().getFullYear() && 
					(mm==12?1:mm+1) == new Date().getMonth()+1 && meizzWDay[i] == new Date().getDate()) ?
					 "#5CEFA0":"#f5f5f5";
			else
			{
				da.style.backgroundColor =((mm==12?yy+1:yy)==outDate.getFullYear() && (mm==12?1:mm+1)== outDate.getMonth() + 1 && 
				meizzWDay[i]==outDate.getDate())? "#84C1FF" :
				(((mm==12?yy+1:yy) == new Date().getFullYear() && (mm==12?1:mm+1) == new Date().getMonth()+1 && 
				meizzWDay[i] == new Date().getDate()) ? "#5CEFA0":"#f5f5f5");
				//将选中的日期显示为凹下去

				if((mm==12?yy+1:yy)==outDate.getFullYear() && (mm==12?1:mm+1)== outDate.getMonth() + 1 && 
				meizzWDay[i]==outDate.getDate())
				{
					da.borderColorLight="#FFFFFF";
					da.borderColorDark="#63A3E9";
				}
			}
		}
		else		//本月的部分

		{
			da.innerHTML="<b>" + meizzWDay[i] + "</b>";
			da.title=mm +"月" + meizzWDay[i] + "日";
			da.οnclick=Function("meizzDayClick(this.innerText,0)");		//给td赋予onclick事件的处理

			//如果是当前选择的日期,则显示亮蓝色的背景;如果是当前日期,则显示暗黄色背景
			if(!outDate)
				da.style.backgroundColor = (yy == new Date().getFullYear() && mm == new Date().getMonth()+1 && meizzWDay[i] == new Date().getDate())?
					"#5CEFA0":"#f5f5f5";
			else
			{
				da.style.backgroundColor =(yy==outDate.getFullYear() && mm== outDate.getMonth() + 1 && meizzWDay[i]==outDate.getDate())?
					"#84C1FF":((yy == new Date().getFullYear() && mm == new Date().getMonth()+1 && meizzWDay[i] == new Date().getDate())?
					"#5CEFA0":"#f5f5f5");
				//将选中的日期显示为凹下去

				if(yy==outDate.getFullYear() && mm== outDate.getMonth() + 1 && meizzWDay[i]==outDate.getDate())
				{
					da.borderColorLight="#FFFFFF";
					da.borderColorDark="#63A3E9";
				}
			}
		}
        da.style.cursor="hand"
      }
    else{da.innerHTML="";da.style.backgroundColor="";da.style.cursor="default"}
  }
}

function meizzDayClick(n,ex)  //点击显示框选取日期,主输入函数*************
{
  parent.meizzTheDate=n;
  var yy=meizzTheYear;
  var mm = parseInt(meizzTheMonth)+ex;	//ex表示偏移量,用于选择上个月份和下个月份的日期
  var hh=meizzTheHour;
  var mi=meizzTheMinute;
	//判断月份,并进行对应的处理

	if(mm<1){
		yy--;
		mm=12+mm;
	}
	else if(mm>12){
		yy++;
		mm=mm-12;
	}
	
  if (mm < 10){mm = "0" + mm;}

  if (hh<10) {hh="0" + hh;}	//时

  if (mi<10) {mi="0" + mi;}	//分


  if (outObject)
  {
    if (!n) {	//outObject.value=""; 
      return;}
    if ( n < 10){n = "0" + n;}
	
	WriteDateTo(yy,mm,n,hh,mi);
	
    closeLayer(); 
	if (bUseTime)
	{
		try
		{
			outButton.click();
		}
		catch (e)
		{
			setday(outObject);
		}
		
	}
	
  }
  else {closeLayer(); alert("您所要输出的控件对象并不存在!");}
}

function format(n)	//格式化数字为两位字符表示
{
	var m=new String();
	var tmp=new String(n);
	if (n<10 && tmp.length<2)
	{
		m="0"+n;
	}
	else
	{
		m=n;
	}
	return m;
}

function evaSetTime()		//设置用户选择的小时、分钟

{
	odatelayer.meizzHourHead.innerText=meizzTheHour+" 时";  
	odatelayer.meizzMinuteHead.innerText=meizzTheMinute+" 分";
	WriteDateTo(meizzTheYear,meizzTheMonth,meizzTheDate,meizzTheHour,meizzTheMinute)
}

function evaSetTimeNothing()	//设置时间控件为空
{
	odatelayer.meizzHourHead.innerText="";  
	odatelayer.meizzMinuteHead.innerText="";
	WriteDateTo(meizzTheYear,meizzTheMonth,meizzTheDate,meizzTheHour,meizzTheMinute)
}

function evaSetTimeNow()	//设置时间控件为当前时间

{
	odatelayer.meizzHourHead.innerText=new Date().getHours()+" 时";
	odatelayer.meizzMinuteHead.innerText=new Date().getMinutes()+" 分";
	meizzTheHour = new Date().getHours();
	meizzTheMinute = new Date().getMinutes();
	WriteDateTo(meizzTheYear,meizzTheMonth,meizzTheDate,meizzTheHour,meizzTheMinute)
}

function UseTime(ctl)
{
	if(bCanUseTime)
	{
		bUseTime=!bUseTime;
		if (bUseTime)
		{
			bImgSwitch();
			ctl.innerHTML=bImg;
			evaSetTime();		//显示时间,用户原来选择的时间

			//evaSetTimeNow();	//显示当前时间
		}
		else
		{
			bImgSwitch();
			ctl.innerHTML=bImg;
			evaSetTimeNothing();
		}
	}
}

function WriteDateTo(yy,mm,n,hh,mi)
{
	if (bUseTime)
	{
	    outObject.value= yy + "-" + format(mm) + "-" + format(n) + " " + format(hh) + ":" + format(mi) + ":" + "00"; //注:在这里你可以输出改成你想要的格式
	}
	else
	{
		outObject.value= yy + "-" + format(mm) + "-" + format(n); //注:在这里你可以输出改成你想要的格式
	}
}

function bImgSwitch()
{
	if (bUseTime)
	{
		bImg="时间开启";		
	}
	else
	{
		bImg="时间关闭";		
	}
}


		</script>

3

<script>
/调用实例
//        <div>
//                <span>交易查询:</span> <span>从
//                    <input name="control_date" type="text" id="control_date" size="10"
//                        maxlength="10" οnclick="new Calendar().show(this);" readonly="readonly" />
//                    <input type="button" name="button" id="button" value="button" οnclick="new Calendar().show(this.form.control_date);" /></span>
//                <span>至
//                    <input name="control_date2" type="text" id="control_date2" size="10"
//                        maxlength="10" οnclick="new Calendar().show(this);" readonly="readonly" />
//                    <input type="button" name="button" id="button1" value="button" οnclick="new Calendar().show(this.form.control_date2);" /></span>

//        </div>

<!--
/**
 * Calendar
 * @param   beginYear           1990
 * @param   endYear             2010
 * @param   language            0(zh_cn)|1(en_us)|2(en_en)|3(zh_tw)
 * @param   patternDelimiter    "-"
 * @param   date2StringPattern  "yyyy-MM-dd"
 * @param   string2DatePattern  "ymd"
 * @version 1.0 build 2006-04-01
 * @version 1.1 build 2006-12-17
 * @author  KimSoft (jinqinghua [at] gmail.com)
 * NOTE!    you can use it free, but keep the copyright please
 * IMPORTANT:you must include this script file inner html body elment 
 */
function Calendar(beginYear, endYear, language, patternDelimiter, date2StringPattern, string2DatePattern) {
	this.beginYear = beginYear || 1990;
	this.endYear   = endYear   || 2020;
	this.language  = language  || 0;
	this.patternDelimiter = patternDelimiter     || "-";
	this.date2StringPattern = date2StringPattern || Calendar.language["date2StringPattern"][this.language].replace(/\-/g, this.patternDelimiter);
	this.string2DatePattern = string2DatePattern || Calendar.language["string2DatePattern"][this.language];
	
	this.dateControl = null;
	this.panel  = this.getElementById("__calendarPanel");
	this.iframe = window.frames["__calendarIframe"];
	this.form   = null;
	
	this.date = new Date();
	this.year = this.date.getFullYear();
	this.month = this.date.getMonth();
	
	this.colors = {"bg_cur_day":"#00CC33","bg_over":"#EFEFEF","bg_out":"#FFCC00"}
};

Calendar.language = {
	"year"   : ["\u5e74", "", "", "\u5e74"],
	"months" : [
				["\u4e00\u6708","\u4e8c\u6708","\u4e09\u6708","\u56db\u6708","\u4e94\u6708","\u516d\u6708","\u4e03\u6708","\u516b\u6708","\u4e5d\u6708","\u5341\u6708","\u5341\u4e00\u6708","\u5341\u4e8c\u6708"],
				["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],
				["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],
				["\u4e00\u6708","\u4e8c\u6708","\u4e09\u6708","\u56db\u6708","\u4e94\u6708","\u516d\u6708","\u4e03\u6708","\u516b\u6708","\u4e5d\u6708","\u5341\u6708","\u5341\u4e00\u6708","\u5341\u4e8c\u6708"]
				],
	"weeks"  : [["\u65e5","\u4e00","\u4e8c","\u4e09","\u56db","\u4e94","\u516d"],
				["Sun","Mon","Tur","Wed","Thu","Fri","Sat"],
				["Sun","Mon","Tur","Wed","Thu","Fri","Sat"],
				["\u65e5","\u4e00","\u4e8c","\u4e09","\u56db","\u4e94","\u516d"]
		],
	"clear"  : ["\u6e05\u7a7a", "Clear", "Clear", "\u6e05\u7a7a"],
	"today"  : ["\u4eca\u5929", "Today", "Today", "\u4eca\u5929"],
	"close"  : ["\u5173\u95ed", "Close", "Close", "\u95dc\u9589"],
	"date2StringPattern" : ["yyyy-MM-dd", "yyyy-MM-dd", "yyyy-MM-dd", "yyyy-MM-dd"],
	"string2DatePattern" : ["ymd","ymd", "ymd", "ymd"]
};

Calendar.prototype.draw = function() {
	calendar = this;
	
	var _cs = [];
	_cs[_cs.length] = '<form id="__calendarForm" name="__calendarForm" method="post">';
	_cs[_cs.length] = '<table id="__calendarTable" width="100%" border="0" cellpadding="3" cellspacing="1" align="center">';
	_cs[_cs.length] = ' <tr>';
	_cs[_cs.length] = '  <th><input class="l" name="goPrevMonthButton" type="button" id="goPrevMonthButton" value="<" \/><\/th>';
	_cs[_cs.length] = '  <th colspan="5"><select class="year" name="yearSelect" id="yearSelect"><\/select><select class="month" name="monthSelect" id="monthSelect"><\/select><\/th>';
	_cs[_cs.length] = '  <th><input class="r" name="goNextMonthButton" type="button" id="goNextMonthButton" value=">" \/><\/th>';
	_cs[_cs.length] = ' <\/tr>';
	_cs[_cs.length] = ' <tr>';
	for(var i = 0; i < 7; i++) {
		_cs[_cs.length] = '<th class="theader">';
		_cs[_cs.length] = Calendar.language["weeks"][this.language][i];
		_cs[_cs.length] = '<\/th>';	
	}
	_cs[_cs.length] = '<\/tr>';
	for(var i = 0; i < 6; i++){
		_cs[_cs.length] = '<tr align="center">';
		for(var j = 0; j < 7; j++) {
			switch (j) {
				case 0: _cs[_cs.length] = '<td class="sun"> <\/td>'; break;
				case 6: _cs[_cs.length] = '<td class="sat"> <\/td>'; break;
				default:_cs[_cs.length] = '<td class="normal"> <\/td>'; break;
			}
		}
		_cs[_cs.length] = '<\/tr>';
	}
	_cs[_cs.length] = ' <tr>';
	_cs[_cs.length] = '  <th colspan="2"><input type="button" class="b" name="clearButton" id="clearButton" \/><\/th>';
	_cs[_cs.length] = '  <th colspan="3"><input type="button" class="b" name="selectTodayButton" id="selectTodayButton" \/><\/th>';
	_cs[_cs.length] = '  <th colspan="2"><input type="button" class="b" name="closeButton" id="closeButton" \/><\/th>';
	_cs[_cs.length] = ' <\/tr>';
	_cs[_cs.length] = '<\/table>';
	_cs[_cs.length] = '<\/form>';
	
	this.iframe.document.body.innerHTML = _cs.join("");
	this.form = this.iframe.document.forms["__calendarForm"];

	this.form.clearButton.value = Calendar.language["clear"][this.language];
	this.form.selectTodayButton.value = Calendar.language["today"][this.language];
	this.form.closeButton.value = Calendar.language["close"][this.language];
	
	this.form.goPrevMonthButton.onclick = function () {calendar.goPrevMonth(this);}
	this.form.goNextMonthButton.onclick = function () {calendar.goNextMonth(this);}
	this.form.yearSelect.onchange = function () {calendar.update(this);}
	this.form.monthSelect.onchange = function () {calendar.update(this);}
	
	this.form.clearButton.onclick = function () {calendar.dateControl.value = "";calendar.hide();}
	this.form.closeButton.onclick = function () {calendar.hide();}
	this.form.selectTodayButton.onclick = function () {
		var today = new Date();
		calendar.date = today;
		calendar.year = today.getFullYear();
		calendar.month = today.getMonth();
		calendar.dateControl.value = today.format(calendar.date2StringPattern);
		calendar.hide();
	}
};

Calendar.prototype.bindYear = function() {
	var ys = this.form.yearSelect;
	ys.length = 0;
	for (var i = this.beginYear; i <= this.endYear; i++){
		ys.options[ys.length] = new Option(i + Calendar.language["year"][this.language], i);
	}
};

Calendar.prototype.bindMonth = function() {
	var ms = this.form.monthSelect;
	ms.length = 0;
	for (var i = 0; i < 12; i++){
		ms.options[ms.length] = new Option(Calendar.language["months"][this.language][i], i);
	}
};

Calendar.prototype.goPrevMonth = function(e){
	if (this.year == this.beginYear && this.month == 0){return;}
	this.month--;
	if (this.month == -1) {
		this.year--;
		this.month = 11;
	}
	this.date = new Date(this.year, this.month, 1);
	this.changeSelect();
	this.bindData();
};

Calendar.prototype.goNextMonth = function(e){
	if (this.year == this.endYear && this.month == 11){return;}
	this.month++;
	if (this.month == 12) {
		this.year++;
		this.month = 0;
	}
	this.date = new Date(this.year, this.month, 1);
	this.changeSelect();
	this.bindData();
};

Calendar.prototype.changeSelect = function() {
	var ys = this.form.yearSelect;
	var ms = this.form.monthSelect;
	for (var i= 0; i < ys.length; i++){
		if (ys.options[i].value == this.date.getFullYear()){
			ys[i].selected = true;
			break;
		}
	}
	for (var i= 0; i < ms.length; i++){
		if (ms.options[i].value == this.date.getMonth()){
			ms[i].selected = true;
			break;
		}
	}
};

Calendar.prototype.update = function (e){
	this.year  = e.form.yearSelect.options[e.form.yearSelect.selectedIndex].value;
	this.month = e.form.monthSelect.options[e.form.monthSelect.selectedIndex].value;
	this.date = new Date(this.year, this.month, 1);
	this.changeSelect();
	this.bindData();
};

Calendar.prototype.bindData = function () {
	var calendar = this;
	var dateArray = this.getMonthViewDateArray(this.date.getFullYear(), this.date.getMonth());
	var tds = this.getElementsByTagName("td", this.getElementById("__calendarTable", this.iframe.document));
	for(var i = 0; i < tds.length; i++) {
  		tds[i].style.backgroundColor = calendar.colors["bg_over"];
		tds[i].onclick = null;
		tds[i].onmouseover = null;
		tds[i].onmouseout = null;
		tds[i].innerHTML = dateArray[i] || " ";
		if (i > dateArray.length - 1) continue;
		if (dateArray[i]){
			tds[i].onclick = function () {
				if (calendar.dateControl){
					calendar.dateControl.value = new Date(calendar.date.getFullYear(),
														calendar.date.getMonth(),
														this.innerHTML).format(calendar.date2StringPattern);
				}
				calendar.hide();
			}
			tds[i].onmouseover = function () {this.style.backgroundColor = calendar.colors["bg_out"];}
			tds[i].onmouseout  = function () {this.style.backgroundColor = calendar.colors["bg_over"];}
			var today = new Date();
			if (today.getFullYear() == calendar.date.getFullYear()) {
				if (today.getMonth() == calendar.date.getMonth()) {
					if (today.getDate() == dateArray[i]) {
						tds[i].style.backgroundColor = calendar.colors["bg_cur_day"];
						tds[i].onmouseover = function () {this.style.backgroundColor = calendar.colors["bg_out"];}
						tds[i].onmouseout  = function () {this.style.backgroundColor = calendar.colors["bg_cur_day"];}
					}
				}
			}
		}//end if
	}//end for
};

Calendar.prototype.getMonthViewDateArray = function (y, m) {
	var dateArray = new Array(42);
	var dayOfFirstDate = new Date(y, m, 1).getDay();
	var dateCountOfMonth = new Date(y, m + 1, 0).getDate();
	for (var i = 0; i < dateCountOfMonth; i++) {
		dateArray[i + dayOfFirstDate] = i + 1;
	}
	return dateArray;
};

Calendar.prototype.show = function (dateControl, popuControl) {
	if (this.panel.style.visibility == "visible") {
		this.panel.style.visibility = "hidden";
	}
	if (!dateControl){
		throw new Error("arguments[0] is necessary!")
	}
	this.dateControl = dateControl;
	popuControl = popuControl || dateControl;

	this.draw();
	this.bindYear();
	this.bindMonth();
	if (dateControl.value.length > 0){
		this.date  = new Date(dateControl.value.toDate(this.patternDelimiter, this.string2DatePattern));
		this.year  = this.date.getFullYear();
		this.month = this.date.getMonth();
	}
	this.changeSelect();
	this.bindData();

	var xy = this.getAbsPoint(popuControl);
	this.panel.style.left = xy.x + "px";
	this.panel.style.top = (xy.y + dateControl.offsetHeight) + "px";
	this.panel.style.visibility = "visible";
};

Calendar.prototype.hide = function() {
	this.panel.style.visibility = "hidden";
};

Calendar.prototype.getElementById = function(id, object){
	object = object || document;
	return document.getElementById ? object.getElementById(id) : document.all(id);
};

Calendar.prototype.getElementsByTagName = function(tagName, object){
	object = object || document;
	return document.getElementsByTagName ? object.getElementsByTagName(tagName) : document.all.tags(tagName);
};

Calendar.prototype.getAbsPoint = function (e){
	var x = e.offsetLeft;
	var y = e.offsetTop;
	while(e = e.offsetParent){
		x += e.offsetLeft;
		y += e.offsetTop;
	}
	return {"x": x, "y": y};
};

/**
 * @param   d the delimiter
 * @param   p the pattern of your date
 * @author  meizz
 * @author  kimsoft add w+ pattern
 */
Date.prototype.format = function(style) {
	var o = {
		"M+" : this.getMonth() + 1, //month
		"d+" : this.getDate(),      //day
		"h+" : this.getHours(),     //hour
		"m+" : this.getMinutes(),   //minute
		"s+" : this.getSeconds(),   //second
		"w+" : "\u65e5\u4e00\u4e8c\u4e09\u56db\u4e94\u516d".charAt(this.getDay()),   //week
		"q+" : Math.floor((this.getMonth() + 3) / 3),  //quarter
		"S"  : this.getMilliseconds() //millisecond
	}
	if (/(y+)/.test(style)) {
		style = style.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
	}
	for(var k in o){
		if (new RegExp("("+ k +")").test(style)){
			style = style.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
		}
	}
	return style;
};

/**
 * @param d the delimiter
 * @param p the pattern of your date
 * @rebuilder kimsoft
 * @version build 2006.12.15
 */
String.prototype.toDate = function(delimiter, pattern) {
	delimiter = delimiter || "-";
	pattern = pattern || "ymd";
	var a = this.split(delimiter);
	var y = parseInt(a[pattern.indexOf("y")], 10);
	//remember to change this next century ;)
	if(y.toString().length <= 2) y += 2000;
	if(isNaN(y)) y = new Date().getFullYear();
	var m = parseInt(a[pattern.indexOf("m")], 10) - 1;
	var d = parseInt(a[pattern.indexOf("d")], 10);
	if(isNaN(d)) d = 1;
	return new Date(y, m, d);
};

document.writeln('<div id="__calendarPanel" style="position:absolute;visibility:hidden;z-index:9999;background-color:#FFFFFF;border:1px solid #666666;width:200px;height:216px;">');
document.writeln('<iframe name="__calendarIframe" id="__calendarIframe" width="100%" height="100%" scrolling="no" frameborder="0" style="margin:0px;"><\/iframe>');
var __ci = window.frames['__calendarIframe'];
__ci.document.writeln('<!DOCTYPE html PUBLIC "-\/\/W3C\/\/DTD XHTML 1.0 Transitional\/\/EN" "http:\/\/www.w3.org\/TR\/xhtml1\/DTD\/xhtml1-transitional.dtd">');
__ci.document.writeln('<html xmlns="http:\/\/www.w3.org\/1999\/xhtml">');
__ci.document.writeln('<head>');
__ci.document.writeln('<meta http-equiv="Content-Type" content="text\/html; charset=utf-8" \/>');
__ci.document.writeln('<title>Web Calendar(UTF-8) Written By KimSoft<\/title>');
__ci.document.writeln('<style type="text\/css">');
__ci.document.writeln('<!--');
__ci.document.writeln('body {font-size:12px;margin:0px;text-align:center;}');
__ci.document.writeln('form {margin:0px;}');
__ci.document.writeln('select {font-size:12px;background-color:#EFEFEF;}');
__ci.document.writeln('table {border:0px solid #CCCCCC;background-color:#FFFFFF}');
__ci.document.writeln('th {font-size:12px;font-weight:normal;background-color:#FFFFFF;}');
__ci.document.writeln('th.theader {font-weight:normal;background-color:#666666;color:#FFFFFF;width:24px;}');
__ci.document.writeln('select.year {width:64px;}');
__ci.document.writeln('select.month {width:60px;}');
__ci.document.writeln('td {font-size:12px;text-align:center;}');
__ci.document.writeln('td.sat {color:#0000FF;background-color:#EFEFEF;}');
__ci.document.writeln('td.sun {color:#FF0000;background-color:#EFEFEF;}');
__ci.document.writeln('td.normal {background-color:#EFEFEF;}');
__ci.document.writeln('input.l {border: 1px solid #CCCCCC;background-color:#EFEFEF;width:20px;height:20px;}');
__ci.document.writeln('input.r {border: 1px solid #CCCCCC;background-color:#EFEFEF;width:20px;height:20px;}');
__ci.document.writeln('input.b {border: 1px solid #CCCCCC;background-color:#EFEFEF;width:100%;height:20px;}');
__ci.document.writeln('-->');
__ci.document.writeln('<\/style>');
__ci.document.writeln('<\/head>');
__ci.document.writeln('<body>');
__ci.document.writeln('<\/body>');
__ci.document.writeln('<\/html>');
__ci.document.close();
document.writeln('<\/div>');
var calendar = new Calendar();
//-->
</script>	

4

<script language="JavaScript">
			//        <div>
//            <input type="text" name="time1" id="time1" οnclick="MyCalendar.SetDate(this)" value="2006-8-1" />
//            <input type="text" name="time2" id="time2" value="2006-8-1" /><input name="" type="button"
//                οnclick="MyCalendar.SetDate(this,document.getElementById('time2'))" value="选择" />
//        </div>

function L_calendar(){}
L_calendar.prototype={
	_VersionInfo:"Version:1.0
作者: lingye",
	Moveable:true,
	NewName:"",
	insertId:"",
	ClickObject:null,
	InputObject:null,
	InputDate:null,
	IsOpen:false,
	MouseX:0,
	MouseY:0,
	GetDateLayer:function(){
		return window.L_DateLayer;
		},
	L_TheYear:new Date().getFullYear(), //定义年的变量的初始值
	L_TheMonth:new Date().getMonth()+1,//定义月的变量的初始值
	L_WDay:new Array(39),//定义写日期的数组
	MonHead:new Array(31,28,31,30,31,30,31,31,30,31,30,31),    		   //定义阳历中每个月的最大天数
	GetY:function(){
		var obj;
		if (arguments.length > 0){
			obj==arguments[0];
			}
		else{
			obj=this.ClickObject;
			}
		if(obj!=null){
			var y = obj.offsetTop;
			while (obj = obj.offsetParent) y += obj.offsetTop;
			return y;}
		else{return 0;}
		},
	GetX:function(){
		var obj;
		if (arguments.length > 0){
			obj==arguments[0];
			
			}
		else{
			obj=this.ClickObject;
			}
		if(obj!=null){
			var y = obj.offsetLeft;
			while (obj = obj.offsetParent) y += obj.offsetLeft;
			return y;}
		else{return 0;}
		},
	CreateHTML:function(){
		var htmlstr="";
		htmlstr+="<div id=\"L_calendar\">\r\n";
		htmlstr+="<span id=\"SelectYearLayer\" style=\"z-index: 9999;position: absolute;top: 3; left: 19;display: none\"></span>\r\n";
		htmlstr+="<span id=\"SelectMonthLayer\" style=\"z-index: 9999;position: absolute;top: 3; left: 78;display: none\"></span>\r\n";
		htmlstr+="<div id=\"L_calendar-year-month\"><div id=\"L_calendar-PrevM\" οnclick=\"parent."+this.NewName+".PrevM()\" title=\"前一月\"><b><</b></div><div id=\"L_calendar-year\" οnmοuseοver=\"style.backgroundColor='#FFD700'\" οnmοuseοut=\"style.backgroundColor='white'\" οnclick=\"parent."+this.NewName+".SelectYearInnerHTML('"+this.L_TheYear+"')\"></div><div id=\"L_calendar-month\"  οnmοuseοver=\"style.backgroundColor='#FFD700'\" οnmοuseοut=\"style.backgroundColor='white'\" οnclick=\"parent."+this.NewName+".SelectMonthInnerHTML('"+this.L_TheMonth+"')\"></div><div id=\"L_calendar-NextM\" οnclick=\"parent."+this.NewName+".NextM()\" title=\"后一月\"><b>></b></div></div>\r\n";
		htmlstr+="<div id=\"L_calendar-week\"><ul  οnmοuseup=\"StopMove()\"><li>日</li><li>一</li><li>二</li><li>三</li><li>四</li><li>五</li><li>六</li></ul></div>\r\n";
		htmlstr+="<div id=\"L_calendar-day\">\r\n";
		htmlstr+="<ul>\r\n";
		for(var i=0;i<this.L_WDay.length;i++){
			htmlstr+="<li id=\"L_calendar-day_"+i+"\" style=\"background:#e0e0e0\" οnmοuseοver=\"this.style.background='#FFD700'\"  οnmοuseοut=\"this.style.background='#e0e0e0'\"></li>\r\n";
			}
		htmlstr+="</ul>\r\n";
		htmlstr+="<span id=\"L_calendar-today\" οnclick=\"parent."+this.NewName+".Today()\"><b>Today</b></span>\r\n";
		htmlstr+="</div>\r\n";
		//htmlstr+="<div id=\"L_calendar-control\"></div>\r\n";
		htmlstr+="</div>\r\n";
		htmlstr+="<scr" + "ipt type=\"text/javas" + "cript\">\r\n";
		htmlstr+="var MouseX,MouseY;";
		htmlstr+="var Moveable="+this.Moveable+";\r\n";
		htmlstr+="var MoveaStart=false;\r\n";
		htmlstr+="document.οnmοusemοve=function(e)\r\n";
		htmlstr+="{\r\n";
		htmlstr+="var DateLayer=parent.document.getElementById(\"L_DateLayer\");\r\n";
		htmlstr+="	e = window.event || e;\r\n";
		htmlstr+="var DateLayerLeft=DateLayer.style.posLeft || parseInt(DateLayer.style.left.replace(\"px\",\"\"));\r\n";
		htmlstr+="var DateLayerTop=DateLayer.style.posTop || parseInt(DateLayer.style.top.replace(\"px\",\"\"));\r\n";
		htmlstr+="if(MoveaStart){DateLayer.style.left=(DateLayerLeft+e.clientX-MouseX)+\"px\";DateLayer.style.top=(DateLayerTop+e.clientY-MouseY)+\"px\"}\r\n";
		htmlstr+=";\r\n";
		htmlstr+="}\r\n";
		
		htmlstr+="document.getElementById(\"L_calendar-week\").οnmοusedοwn=function(e){\r\n";
		htmlstr+="if(Moveable){MoveaStart=true;}\r\n";
		htmlstr+="	e = window.event || e;\r\n";
		htmlstr+="  MouseX = e.clientX;\r\n";
		htmlstr+="  MouseY = e.clientY;\r\n";
		htmlstr+="	}\r\n";
		
		htmlstr+="function StopMove(){\r\n";
		htmlstr+="MoveaStart=false;\r\n";
		htmlstr+="	}\r\n";
		htmlstr+="</scr"+"ipt>\r\n";
		var stylestr="";
		stylestr+="<style type=\"text/css\">";
		stylestr+="body{background:#fff;font-size:12px;margin:0px;padding:0px;text-align:left}\r\n";
		stylestr+="#L_calendar{border:1px solid blue;width:158px;padding:1px;height:180px;z-index:9998;text-align:center}\r\n";
		stylestr+="#L_calendar-year-month{height:23px;line-height:23px;z-index:9998;}\r\n";
		stylestr+="#L_calendar-year{line-height:23px;width:60px;float:left;z-index:9998;position: absolute;top: 3; left: 19;cursor:default}\r\n";
		stylestr+="#L_calendar-month{line-height:23px;width:48px;float:left;z-index:9998;position: absolute;top: 3; left: 78;cursor:default}\r\n";
		stylestr+="#L_calendar-PrevM{position: absolute;top: 3; left: 5;cursor:pointer}"
		stylestr+="#L_calendar-NextM{position: absolute;top: 3; left: 145;cursor:pointer}"
		stylestr+="#L_calendar-week{height:23px;line-height:23px;z-index:9998;}\r\n";
		stylestr+="#L_calendar-day{height:136px;z-index:9998;}\r\n";
		stylestr+="#L_calendar-week ul{cursor:move;list-style:none;margin:0px;padding:0px;}\r\n";
		stylestr+="#L_calendar-week li{width:20px;height:20px;float:left;;margin:1px;padding:0px;text-align:center;}\r\n";
		stylestr+="#L_calendar-day ul{list-style:none;margin:0px;padding:0px;}\r\n";
		stylestr+="#L_calendar-day li{cursor:pointer;width:20px;height:20px;float:left;;margin:1px;padding:0px;}\r\n";
		stylestr+="#L_calendar-control{height:25px;z-index:9998;}\r\n";
		stylestr+="#L_calendar-today{cursor:pointer;float:left;width:63px;height:20px;line-height:20px;margin:1px;text-align:center;background:red}"
		stylestr+="</style>";
		var TempLateContent="<html>\r\n";
		TempLateContent+="<head>\r\n";
		TempLateContent+="<title></title>\r\n";
		TempLateContent+=stylestr;
		TempLateContent+="</head>\r\n";
		TempLateContent+="<body>\r\n";
		TempLateContent+=htmlstr;
		TempLateContent+="</body>\r\n";
		TempLateContent+="</html>\r\n";
		this.GetDateLayer().document.writeln(TempLateContent);
		this.GetDateLayer().document.close();
		},
	InsertHTML:function(id,htmlstr){
		var L_DateLayer=this.GetDateLayer();
		if(L_DateLayer){L_DateLayer.document.getElementById(id).innerHTML=htmlstr;}
		},
	WriteHead:function (yy,mm)  //往 head 中写入当前的年与月
  	{
		this.InsertHTML("L_calendar-year",yy + " 年");
		this.InsertHTML("L_calendar-month",mm + " 月");
  	},
	IsPinYear:function(year)            //判断是否闰平年
  	{
    	if (0==year%4&&((year%100!=0)||(year%400==0))) return true;else return false;
  	},
	GetMonthCount:function(year,month)  //闰年二月为29天
  	{
    	var c=this.MonHead[month-1];if((month==2)&&this.IsPinYear(year)) c++;return c;
  	},
	GetDOW:function(day,month,year)     //求某天的星期几
  	{
    	var dt=new Date(year,month-1,day).getDay()/7; return dt;
  	},
	GetText:function(obj){
		if(obj.innerText){return obj.innerText}
		else{return obj.textContent}
		},
	PrevM:function()  //往前翻月份
  	{
    	if(this.L_TheMonth>1){this.L_TheMonth--}else{this.L_TheYear--;this.L_TheMonth=12;}
    	this.SetDay(this.L_TheYear,this.L_TheMonth);
  	},
	NextM:function()  //往后翻月份
  	{
    	if(this.L_TheMonth==12){this.L_TheYear++;this.L_TheMonth=1}else{this.L_TheMonth++}
    	this.SetDay(this.L_TheYear,this.L_TheMonth);
  	},
	Today:function()  //Today Button
  	{
		var today;
    	this.L_TheYear = new Date().getFullYear();
    	this.L_TheMonth = new Date().getMonth()+1;
    	today=new Date().getDate();
    	if(this.InputObject){
		this.InputObject.value=this.L_TheYear + "-" + this.L_TheMonth + "-" + today;
    	}
    	this.CloseLayer();
  	},
	SetDay:function (yy,mm)   //主要的写程序**********
	{
  		this.WriteHead(yy,mm);
	  	//设置当前年月的公共变量为传入值
  		this.L_TheYear=yy;
  		this.L_TheMonth=mm;
		//当页面本身位于框架中时 IE会返回错误的parent
		if(window.top.location.href!=window.location.href){
			for(var i_f=0;i_f<window.top.frames.length;i_f++){
		  		if(window.top.frames[i_f].location.href==window.location.href){L_DateLayer_Parent=window.top.frames[i_f];}
			}
		}
		else{
			L_DateLayer_Parent=window.parent;
			}
  		for (var i = 0; i < 39; i++){this.L_WDay[i]=""};  //将显示框的内容全部清空
  		var day1 = 1,day2=1,firstday = new Date(yy,mm-1,1).getDay();  //某月第一天的星期几
  		for (i=0;i<firstday;i++)this.L_WDay[i]=this.GetMonthCount(mm==1?yy-1:yy,mm==1?12:mm-1)-firstday+i+1	//上个月的最后几天
  		for (i = firstday; day1 < this.GetMonthCount(yy,mm)+1; i++){this.L_WDay[i]=day1;day1++;}
  		for (i=firstday+this.GetMonthCount(yy,mm);i<39;i++){this.L_WDay[i]=day2;day2++}
  		for (i = 0; i < 39; i++)
		{
			var da=this.GetDateLayer().document.getElementById("L_calendar-day_"+i+"");
			var month,day;
    		if (this.L_WDay[i]!="")
			{ 
				if(i<firstday){
					da.innerHTML="<b style=\"color:gray\">" + this.L_WDay[i] + "</b>";
					month=(mm==1?12:mm-1);
					day=this.L_WDay[i];
				}
				else if(i>=firstday+this.GetMonthCount(yy,mm)){
					da.innerHTML="<b style=\"color:gray\">" + this.L_WDay[i] + "</b>";
					month=(mm==1?12:mm+1);
					day=this.L_WDay[i];
				}
				else{
					da.innerHTML="<b style=\"color:#000\">" + this.L_WDay[i] + "</b>";
					month=(mm==1?12:mm);
					day=this.L_WDay[i];
					if(document.all){
						da.οnclick=Function("L_DateLayer_Parent."+this.NewName+".DayClick("+month+","+day+")");
					}
					else{
						da.setAttribute("onclick","parent."+this.NewName+".DayClick("+month+","+day+")");
					}
				}
				da.title=month+" 月"+day+" 日";
				da.style.background=(yy == new Date().getFullYear()&&month==new Date().getMonth()+1&&day==new Date().getDate())? "#FFD700":"#e0e0e0";
				if(this.InputDate!=null){
					if(yy==this.InputDate.getFullYear() && month== this.InputDate.getMonth() + 1 && day==this.InputDate.getDate()){
						da.style.background="#0650D2";
						}
					}
      		}
  		}
	},
	SelectYearInnerHTML:function (strYear) //年份的下拉框
	{
 	 	if (strYear.match(/\D/)!=null){alert("年份输入参数不是数字!");return;}
 	 	var m = (strYear) ? strYear : new Date().getFullYear();
		if (m < 1000 || m > 9999) {alert("年份值不在 1000 到 9999 之间!");return;}
  		var n = m - 10;
  		if (n < 1000) n = 1000;
  		if (n + 26 > 9999) n = 9974;
  		var s = "<select name=\"L_SelectYear\" id=\"L_SelectYear\" style='font-size: 12px' "
     		s += "οnblur='document.getElementById(\"SelectYearLayer\").style.display=\"none\"' "
     		s += "οnchange='document.getElementById(\"SelectYearLayer\").style.display=\"none\";"
     		s += "parent."+this.NewName+".L_TheYear = this.value; parent."+this.NewName+".SetDay(parent."+this.NewName+".L_TheYear,parent."+this.NewName+".L_TheMonth)'>\r\n";
  		var selectInnerHTML = s;
  		for (var i = n; i < n + 26; i++)
  		{
    		if (i == m)
       		{selectInnerHTML += "<option value='" + i + "' selected>" + i + "年" + "</option>\r\n";}
    		else {selectInnerHTML += "<option value='" + i + "'>" + i + "年" + "</option>\r\n";}
 		}
  		selectInnerHTML += "</select>";
		var DateLayer=this.GetDateLayer();
  		DateLayer.document.getElementById("SelectYearLayer").style.display="";
  		DateLayer.document.getElementById("SelectYearLayer").innerHTML = selectInnerHTML;
  		DateLayer.document.getElementById("L_SelectYear").focus();
		},
	SelectMonthInnerHTML:function (strMonth) //月份的下拉框
	{
  		if (strMonth.match(/\D/)!=null){alert("月份输入参数不是数字!");return;}
  		var m = (strMonth) ? strMonth : new Date().getMonth() + 1;
 		var s = "<select name=\"L_SelectYear\" id=\"L_SelectMonth\" style='font-size: 12px' "
     		s += "οnblur='document.getElementById(\"SelectMonthLayer\").style.display=\"none\"' "
     		s += "οnchange='document.getElementById(\"SelectMonthLayer\").style.display=\"none\";"
     		s += "parent."+this.NewName+".L_TheMonth = this.value; parent."+this.NewName+".SetDay(parent."+this.NewName+".L_TheYear,parent."+this.NewName+".L_TheMonth)'>\r\n";
  		var selectInnerHTML = s;
  		for (var i = 1; i < 13; i++)
  		{
    		if (i == m)
       		{selectInnerHTML += "<option value='"+i+"' selected>"+i+"月"+"</option>\r\n";}
    		else {selectInnerHTML += "<option value='"+i+"'>"+i+"月"+"</option>\r\n";}
  		}
  		selectInnerHTML += "</select>";
		var DateLayer=this.GetDateLayer();
  		DateLayer.document.getElementById("SelectMonthLayer").style.display="";
  		DateLayer.document.getElementById("SelectMonthLayer").innerHTML = selectInnerHTML;
  		DateLayer.document.getElementById("L_SelectMonth").focus();
	},
	DayClick:function(mm,dd)  //点击显示框选取日期,主输入函数*************
	{
		var yy=this.L_TheYear;
		//判断月份,并进行对应的处理
		if(mm<1){yy--;mm=12+mm;}
		else if(mm>12){yy++;mm=mm-12;}
  		if (mm < 10){mm = "0" + mm;}
  		if (this.ClickObject)
  		{if (!dd) {return;}
    	if ( dd < 10){dd = "0" + dd;}
    	this.InputObject.value= yy + "-" + mm + "-" + dd ; //注:在这里你可以输出改成你想要的格式
    	this.CloseLayer();
 		}
  		else {this.CloseLayer(); alert("您所要输出的控件对象并不存在!");}
	},
	SetDate:function(){
		if (arguments.length <  1){alert("对不起!传入参数太少!");return;}
		else if (arguments.length >  2){alert("对不起!传入参数太多!");return;}
		this.InputObject=(arguments.length==1) ? arguments[0] : arguments[1];
		this.ClickObject=arguments[0];
		var reg = /^(\d+)-(\d{1,2})-(\d{1,2})$/;
		var r = this.InputObject.value.match(reg); 
		if(r!=null){
			r[2]=r[2]-1; 
			var d= new Date(r[1], r[2],r[3]); 
			if(d.getFullYear()==r[1] && d.getMonth()==r[2] && d.getDate()==r[3]){
				this.InputDate=d;		//保存外部传入的日期
			}
			else this.InputDate="";
			this.L_TheYear=r[1];
			this.L_TheMonth=r[2]+1;
			}
		else{
			this.L_TheYear=new Date().getFullYear();
			this.L_TheMonth=new Date().getMonth() + 1
			}
		this.CreateHTML();
		var top=this.GetY();
		var left=this.GetX();
		var DateLayer=document.getElementById("L_DateLayer");
		DateLayer.style.top=top+this.ClickObject.clientHeight+5+"px";
		DateLayer.style.left=left+"px";
		DateLayer.style.display="block";
		if(document.all){
			this.GetDateLayer().document.getElementById("L_calendar").style.width="160px";
			this.GetDateLayer().document.getElementById("L_calendar").style.height="180px"
			}
		else{
			this.GetDateLayer().document.getElementById("L_calendar").style.width="154px";
			this.GetDateLayer().document.getElementById("L_calendar").style.height="180px"
			DateLayer.style.width="158px";
			DateLayer.style.height="250px";
			}
		//alert(DateLayer.style.display)
		this.SetDay(this.L_TheYear,this.L_TheMonth);
		},
	CloseLayer:function(){
		try{
			var DateLayer=document.getElementById("L_DateLayer");
			if((DateLayer.style.display=="" || DateLayer.style.display=="block") && arguments[0]!=this.ClickObject && arguments[0]!=this.InputObject){
				DateLayer.style.display="none";
			}
		}
		catch(e){}
		}
	}
	
document.writeln('<iframe id="L_DateLayer" name="L_DateLayer" frameborder="0" style="position:absolute;width:160px; height:200px;z-index:9998;display:none;"></iframe>');
var L_DateLayer_Parent=null;
var MyCalendar=new L_calendar();
MyCalendar.NewName="MyCalendar";
document.οnclick=function(e)
{
	e = window.event || e;
  	var srcElement = e.srcElement || e.target;
	MyCalendar.CloseLayer(srcElement);
}

5

function Calendar(objName)  
{		
this.style = {
borderColor       		: "#909eff", //边框颜色
headerBackColor    		: "#909EFF", //表头背景颜色
headerFontColor    		: "#ffffff", //表头字体颜色
bodyBarBackColor  		: "#f4f4f4", //日历标题背景色
bodyBarFontColor  		: "#000000", //日历标题字体色
bodyBackColor     		: "#ffffff", //日历背景色
bodyFontColor            : "#000000", //日历字体色 
bodyHolidayFontColor     : "#ff0000", //假日字体色
watermarkColor 		    : "#d4d4d4",  //背景水印色
moreDayColor             : "#cccccc" 
};
this.showMoreDay = false; //是否显示上月和下月的日期
this.Obj = objName;		
this.date = null;
this.mouseOffset = null;
this.dateInput = null;
this.timer = null;	
};
Calendar.prototype.toString = function()
{   
var str = this.getStyle();
str += '<div Author="alin" class="calendar" style="display:none;" onselectstart="return false" οncοntextmenu="return false" id="Calendar">\n';
str += '<div Author="alin" class="cdrWatermark" id="cdrWatermark"></div><div id="cdrBody" style="position:absolute;left:0px;top:0px;z-index:2;width:140px;">';
str += this.getHeader();
str += this.getBody();   
str += '</div><div Author="alin" id="cdrMenu" style="position:absolute;left:0px;top:0px;z-index:3;display:none;"  οnmοuseοver="' + this.Obj + '.showMenu(null);" οnmοuseοut="' + this.Obj + '.hideMenu();"></div></div>';
return str;
};
Calendar.prototype.getStyle = function()
{
var str = '<style type="text/css">\n';
str += '.calendar{position:absolute;width:140px!important;width /**/:142px;height:184px!important;height /**/:174px;background-color:'+this.style.bodyBackColor+';border:1px solid ' + this.style.borderColor + ';left:0px;top:0px;z-index:9999;}\n';
str += '.cdrHeader{background-color:'+ this.style.headerBackColor +';width:140px;height:22px;font-size:12px;color:'+this.style.headerFontColor+';}\n';
str += '.cdrWatermark{position:absolute;left:0px;top:55px;width:140px;font-family: Arial Black;font-size:50px;color:'+this.style.watermarkColor+';z-index:1;text-align:center;}\n';
str += '.cdrBodyBar{background-color:' + this.style.bodyBarBackColor + ';font-size:12px;color:' + this.style.bodyBarFontColor + ';width:140px;height:20px;}\n';
str += '.cdrBody{width:140px;height:122px!important; height /**/:110px;font-size:12px;cursor:pointer;color:' + this.style.bodyFontColor + ';}\n';
str += '.dayOver{height:16px;padding:0px;border:1px solid black;background-color:#f4f4f4;}\n';
str += '.dayOut{padding:1px;border:none;height:16px;}\n';
str += '.menuOver{background-color:'+this.style.headerBackColor+';color:'+this.style.headerFontColor+';font-size:12px;}\n';
str += '.headerOver{border:1px solid black;background-color:#f4f4f4;color:black;cursor:default;}\n';
str += '.cdrMenu{font-size:12px;border:1px solid #000000;background-color:#ffffff;cursor:default;width:100%}\n';
str += 'html>body #Calendar{width:142px;174px;}';
str += '</style>\n';	
return str;
};
Calendar.prototype.getHeader = function()
{
var str = '<table Author="alin" class="cdrHeader" cellSpacing="2" cellPadding="0"><tr Author="alin" align="center">\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" οnmοuseοut="this.className=\'\'" id="previousYear" title="上一年份" style="cursor:pointer;width:10px;" οnclick="'+this.Obj+'.onChangeYear(false);"><<</td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" οnmοuseοut="this.className=\'\'" id="previousMonth" title="上一月份" style="cursor:pointer;width:10px;" οnclick="'+this.Obj+'.onChangeMonth(false);"><</td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" id="currentYear" style="width:50px;" οnclick="' + this.Obj + '.showMenu(true);" οnmοuseοut="' + this.Obj + '.hideMenu();this.className=\'\';">0</td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" id="currentMonth" οnclick="' + this.Obj + '.showMenu(false);" οnmοuseοut="' + this.Obj + '.hideMenu();this.className=\'\';">0</td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" οnmοuseοut="this.className=\'\'" id="nextMonth" title="下一月份" style="cursor:pointer;width:10px;" οnclick="'+this.Obj+'.onChangeMonth(true);">></td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'headerOver\'" οnmοuseοut="this.className=\'\'" id="nextYear" title="下一年份" style="cursor:pointer;width:10px;" οnclick="'+this.Obj+'.onChangeYear(true);">>></td></tr>\n';
str += '</table>\n';
return str;
};
Calendar.prototype.getBody = function()
{
var n = 0;
var str = this.getBodyBar();
str += '<table Author="alin" class="cdrBody" cellSpacing="2" cellPadding="0">\n';   
for(i = 0; i < 6; i++)
{	  
str += '<tr Author="alin" align="center">';
for(j = 0; j < 7; j++)
{
str += '<td Author="alin" class="dayOut" id="cdrDay'+(n++)+'" width="13%"></td>\n';
}
str += '</tr>';
}
str += '</table>\n';
str += '<table Author="alin" class="cdrBodyBar" cellSpacing="2" cellPadding="0"><tr align="center" Author="alin"><td Author="alin" style="cursor:pointer;" οnclick="'+this.Obj+'.getToday();">今天:'+new Date().toFormatString("yyyy年mm月dd日")+'</td></tr></table>\n';
return str;
};
Calendar.prototype.getBodyBar = function()
{
var str = '<table Author="alin_bar" id="cdrBodyBar" class="cdrBodyBar" style="cursor:move;" cellSpacing="2" cellPadding="0"><tr Author="alin_bar" align="center">\n';
var day = new Array('日','一','二','三','四','五','六');
for(i = 0; i < 7; i++)
{
str += '<td Author="alin_bar">' + day[i] + '</td>\n';     
}
str += '</tr></table>';
return str;  
}
Calendar.prototype.getYearMenu = function(year)
{
var str = '<table Author="alin" cellSpacing="0" class="cdrMenu" cellPadding="0">\n';
for(i = 0; i < 10; i++)
{	  
var _year = year + i;
var _date = new Date(_year,this.date.getMonth(),this.date.getDate());
str += '<tr Author="alin" align="center"><td Author="alin" width="13%" height="16" ';
if(this.date.getFullYear() != _year)
{
str += 'οnmοuseοver="this.className=\'menuOver\'" οnmοuseοut="this.className=\'\'" ';
}
else
{
str += 'class="menuOver"';
}
str += 'οnclick="' + this.Obj + '.bindDate(\'' + _date.toFormatString("-") + '\')">' + _year + '年</td>\n';		
str += '</tr>';
}
str += '<tr Author="alin" align="center"><td Author="alin"><table Author="alin" style="font-size:12px;width:100%;" cellSpacing="0" cellPadding="0">\n';
str += '<tr Author="alin" align="center"><td Author="alin" οnmοuseοver="this.className=\'menuOver\'" οnmοuseοut="this.className=\'\'" οnclick="'+this.Obj+'.getYearMenu('+ (year - 10) + ')"><<</td>\n';
str += '<td Author="alin" οnmοuseοver="this.className=\'menuOver\'" οnmοuseοut="this.className=\'\'" οnclick="'+this.Obj+'.getYearMenu('+ (year + 10) +')">>></td><tr>\n';
str += '</table></td></tr>\n';
str += '</table>';
var _menu = getObjById("cdrMenu");
_menu.innerHTML = str;
};
Calendar.prototype.getMonthMenu = function()
{
var str = '<table Author="alin" cellSpacing="0" class="cdrMenu" cellPadding="0">\n';
for(i = 1; i <= 12; i++)
{   
var _date = new Date(this.date.getFullYear(),i-1,this.date.getDate());		
str += '</tr><tr Author="alin" align="center"><td Author="alin" height="16" ';
if(this.date.getMonth() + 1 != i)
{
str += 'οnmοuseοver="this.className=\'menuOver\'" οnmοuseοut="this.className=\'\'" ';
}
else
{
str += 'class="menuOver"';
}
str += 'οnclick="' + this.Obj + '.bindDate(\'' + _date.toFormatString("-") + '\')">'+i+'月</td></tr>\n';
}
str += '</table>';
var _menu = getObjById("cdrMenu");
_menu.innerHTML = str;   
};
Calendar.prototype.show = function()
{
if (arguments.length >  3  || arguments.length == 0)
{
alert("对不起!传入参数不对!" );
return;
}   
var _date = null;
var _evObj = null;
var _initValue = null  
for(i = 0; i < arguments.length; i++)
{
if(typeof(arguments[i]) == "object" && arguments[i].type == "text")
{_date = arguments[i];}
else if(typeof(arguments[i]) == "object")
{_evObj = arguments[i];}
else if(typeof(arguments[i]) == "string")
{_initValue = arguments[i];}  
}
_evObj = _evObj || _date;
inputObj = _date;
targetObj = _evObj
if(!_date){alert("传入参数错误!"); return;}
this.dateInput = _date;
_date = _date.value;
if(_date == "" && _initValue) _date = _initValue;   
this.bindDate(_date);        
var _target = getPosition(_evObj);   
var _obj = getObjById("Calendar");
_obj.style.display = ""; 
_obj.style.left = _target.x + 'px';
if((document.body.clientHeight - (_target.y + _evObj.clientHeight)) >= _obj.clientHeight)
{        
_obj.style.top = (_target.y + _evObj.clientHeight) + 'px';
}
else
{	  
_obj.style.top = (_target.y - _obj.clientHeight) + 'px';
}
};
Calendar.prototype.hide = function()
{
var obj = getObjById("Calendar");
obj.style.display = "none";   
};
Calendar.prototype.bindDate = function(date)
{
var _monthDays = new Array(31,30,31,30,31,30,31,31,30,31,30,31);	
var _arr = date.split('-');		
var _date = new Date(_arr[0],_arr[1]-1,_arr[2]);	
if(isNaN(_date)) _date = new Date();	
this.date = _date;
this.bindHeader();	
var _year = _date.getFullYear();
var _month = _date.getMonth();
var _day = 1;	
var _startDay = new Date(_year,_month,1).getDay();
var _previYear = _month == 0 ? _year - 1 : _year;
var _previMonth = _month == 0 ? 11 : _month - 1;
var _previDay = _monthDays[_previMonth];
if (_previMonth == 1) _previDay =((_previYear%4==0)&&(_previYear%100!=0)||(_previYear%400==0))?29:28;	
_previDay -= _startDay - 1;
var _nextDay = 1;
_monthDays[1] = ((_year%4==0)&&(_year%100!=0)||(_year%400==0))?29:28;
for(i = 0; i < 40; i++)
{	
var _dayElement = getObjById("cdrDay" + i);
_dayElement.onmouseover = Function(this.Obj + ".onMouseOver(this)");
_dayElement.onmouseout = Function(this.Obj + ".onMouseOut(this)");
_dayElement.onclick = Function(this.Obj + ".onClick(this)");
this.onMouseOut(_dayElement);	 		
_dayElement.style.color = "";
if(i < _startDay)
{
//获取上一个月的日期
if(this.showMoreDay)
{
var _previDate = new Date(_year,_month - 1,_previDay);
_dayElement.innerHTML = _previDay;
_dayElement.title = _previDate.toFormatString("yyyy年mm月dd日");
_dayElement.value = _previDate.toFormatString("-");	
_dayElement.style.color = this.style.moreDayColor;	
_previDay++;
}else
{
_dayElement.innerHTML = "";
_dayElement.title = "";
}
}
else if(_day > _monthDays[_month])
{
//获取下个月的日期
if(this.showMoreDay)
{
var _nextDate = new Date(_year,_month + 1,_nextDay);
_dayElement.innerHTML = _nextDay;
_dayElement.title = _nextDate.toFormatString("yyyy年mm月dd日");
_dayElement.value = _nextDate.toFormatString("-");
_dayElement.style.color = this.style.moreDayColor;	
_nextDay++;			   
}else
{
_dayElement.innerHTML = "";
_dayElement.title = "";
}
}
else if(i >= new Date(_year,_month,1).getDay() && _day <= _monthDays[_month])
{
//获取本月日期
_dayElement.innerHTML = _day;
if(_day == _date.getDate())
{
this.onMouseOver(_dayElement);
_dayElement.onmouseover = Function("");   
_dayElement.onmouseout = Function(""); 					  			    
}
if(this.isHoliday(_year,_month,_day))
{
_dayElement.style.color = this.style.bodyHolidayFontColor;			  
}
var _curDate = new Date(_year, _month, _day);
_dayElement.title =  _curDate.toFormatString("yyyy年mm月dd日");
_dayElement.value = _curDate.toFormatString("-");
_day++;
}
else
{
_dayElement.innerHTML = "";
_dayElement.title = "";
}	
}
var _menu = getObjById("cdrMenu");
_menu.style.display = "none";	
};
Calendar.prototype.bindHeader = function()
{
var _curYear = getObjById("currentYear");
var _curMonth = getObjById("currentMonth");
var _watermark = getObjById("cdrWatermark");
_curYear.innerHTML = this.date.toFormatString("yyyy年");
_curMonth.innerHTML =  this.date.toFormatString("mm月");
_watermark.innerHTML = this.date.getFullYear();     
};	
Calendar.prototype.getToday = function()
{
var _date = new Date();
this.bindDate(_date.toFormatString("-"));
};	
Calendar.prototype.isHoliday = function(year,month,date)
{
var _date = new Date(year,month,date);
return (_date.getDay() == 6 || _date.getDay() == 0);
};
Calendar.prototype.onMouseOver = function(obj)
{
obj.className = "dayOver";
};
Calendar.prototype.onMouseOut = function(obj)
{
obj.className = "dayOut";
};	
Calendar.prototype.onClick = function(obj)
{  
if(obj.innerHTML != "")  this.dateInput.value = obj.value;
this.hide();
};
Calendar.prototype.onChangeYear = function(isnext)
{
var _year = this.date.getFullYear();
var _month = this.date.getMonth() + 1;
var _date = this.date.getDate();
if(_year > 999 && _year <10000)
{
if(isnext){_year++;}else{ _year --;}
}
else
{
alert("年份超出范围(1000-9999)!");
}
this.bindDate(_year + '-' + _month + '-' + _date);
};
Calendar.prototype.onChangeMonth = function(isnext)
{
var _year = this.date.getFullYear();
var _month = this.date.getMonth() + 1;
var _date = this.date.getDate();
if(isnext){ _month ++;} else {_month--;}
if(_year > 999 && _year <10000)
{ 
if(_month < 1) {_month = 12; _year--;}
if(_month > 12) {_month = 1; _year++;}
}
else
{
alert("年份超出范围(1000-9999)!");
}  
this.bindDate(_year + '-' + _month + '-' + _date);
};
Calendar.prototype.showMenu = function(isyear)
{
var _menu = getObjById("cdrMenu");
if(isyear != null)
{    
var _obj = (isyear)? getObjById("currentYear") : getObjById("currentMonth");
if(isyear)
{
this.getYearMenu(this.date.getFullYear() - 5);	   
}
else
{
this.getMonthMenu();	   
}
_menu.style.top = (_obj.offsetTop + _obj.offsetHeight) + 'px';
_menu.style.left = _obj.offsetLeft + 'px';	
_menu.style.width = _obj.offsetWidth + 'px';
}
if (this.timer != null) clearTimeout(this.timer);
_menu.style.display="";
}
Calendar.prototype.hideMenu = function()
{
var _obj = getObjById("cdrMenu");
this.timer = window.setTimeout(function(){_obj.style.display='none';},500);	
}
Number.prototype.NaN0 = function()
{
return isNaN(this) ? 0 : this;
}
Date.prototype.toFormatString = function(fs)
{
if(fs.length == 1)
{ 
return this.getFullYear() + fs + (this.getMonth() + 1) + fs + this.getDate(); 
}
fs = fs.replace("yyyy",this.getFullYear());
fs = fs.replace("mm",(this.getMonth() + 1));
fs = fs.replace("dd",this.getDate());
return fs;
}
/************公用方法及变量**************/
var inputObj = null; 
var targetObj = null;	
var dragObj = null; 
var mouseOffset = null; 
function getObjById(obj)
{
if(document.getElementById)
{
return document.getElementById(obj);
}
else
{
alert("浏览器不支持!");
}
}
function mouseCoords(ev)
{
if(ev.pageX || ev.pageY){
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y:ev.clientY + document.body.scrollTop  - document.body.clientTop
};
}
function getPosition(e)
{
var left = 0;
var top  = 0;
while (e.offsetParent){
left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
top  += e.offsetTop  + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
e     = e.offsetParent;
}
left += e.offsetLeft + (e.currentStyle?(parseInt(e.currentStyle.borderLeftWidth)).NaN0():0);
top  += e.offsetTop  + (e.currentStyle?(parseInt(e.currentStyle.borderTopWidth)).NaN0():0);
return {x:left, y:top};
}
function getMouseOffset(target, ev)
{
ev = ev || window.event;
var docPos    = getPosition(target);
var mousePos  = mouseCoords(ev);
return {x:mousePos.x - docPos.x, y:mousePos.y - docPos.y};
}
function closeCalendar(evt){
evt = evt || window.event; 
var _target= evt.target || evt.srcElement; 
if(!_target.getAttribute("Author") &&  _target != inputObj && _target != targetObj)
{
getObjById("Calendar").style.display = "none"; 	  
}  
}
function dragStart(evt){
evt = evt || window.event;	
var _target= evt.target || evt.srcElement;
if(_target.getAttribute("Author") == "alin_bar") 
{	   
dragObj = getObjById("Calendar");	   
mouseOffset = getMouseOffset(dragObj, evt);	 
}   
}
function drag(evt)
{
evt =  evt || window.event;	
if(dragObj)
{		  
var mousePos = mouseCoords(evt); 
dragObj.style.left = (mousePos.x - mouseOffset.x) + 'px';
dragObj.style.top  = (mousePos.y - mouseOffset.y) + 'px';	  
}
}
//拖动结束
function dragEnd(evt)
{
dragObj = null;    
}
/***********End 公用方法*********/
document.onclick = closeCalendar;
document.onmousedown = dragStart;
document.onmousemove = drag;
document.onmouseup = dragEnd;

var c = new Calendar("c");
       document.write(c);


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值