在网页中经常可能需要输入一些时间,如果全部手动输入难以保证准确率,所以收集了一些时间控件。
<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);