javascript日期控件小集合
在网页中经常可能需要输入一些时间，如果全部手动输入难以保证准确率，所以收集了一些时间控件。
<script language="JavaScript">
<!--
/* 调用方法：
<input onfocus="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" oncontextmenu="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" onclick="parent.prevM()"><b><</b></td>"+
" <td width="45%" id=meizzYearHead "+
" onmouseover="this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor""+
" onmouseout="this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor">" +
"<select name=tmpYearSelect onblur="parent.hiddenSelect(this)" style="width:100%;""+
" onchange="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 "+
" onmouseover="this.bgColor=parent.WebCalendar.darkColor; this.style.color=parent.WebCalendar.lightColor""+
" onmouseout="this.bgColor=parent.WebCalendar.lightColor; this.style.color=parent.WebCalendar.wordColor">" +
"<select name=tmpMonthSelect onblur="parent.hiddenSelect(this)" style="width:100%;"" +
" onchange="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 月
快捷键：→" onclick="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 += "onmousedown="dragStart()" onmouseup="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%;" onfocus="this.blur()""+
" type=button value="清空" onclick="parent.WebCalendar.objExport.value="";parent.hiddenCalendar()">" +
" " +
"<input style=" background-color: " + WebCalendar.btnBgColor +";cursor: hand; padding-top: 2px; width: 43%; height: 100%;" onfocus="this.blur()""+
" type=button value="关闭" onclick="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 年
快捷键：↑" onclick="parent.prevY()" type=button value="<<""+
" onfocus="this.blur()" style="meizz:expression(this.disabled=parent.WebCalendar.thisYear==1000)"><input"+
" onfocus="this.blur()" name=prevMonth title="向前翻 1 月
快捷键：←" onclick="parent.prevM()" type=button value="< ">"+
" </td><td align=center><input name=today type=button value="Today" onfocus="this.blur()" style="width: 50px;" title="当前日期
快捷键：T""+
" onclick="parent.returnDate(new Date().getDate() +"/"+ (new Date().getMonth() +1) +"/"+ new Date().getFullYear())">"+
" </td><td align=right><input title="向后翻 1 月
快捷键：→" name=nextMonth onclick="parent.nextM()" type=button value=" >""+
" onfocus="this.blur()"><input name=nextYear title="向后翻 1 年
快捷键：↓" onclick="parent.nextY()" type=button value=">>""+
" onfocus="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("原文本框里的日期有错误！
可能与你定义的显示时分秒有冲突！");
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("你设定的日期输出格式不对！
请重新定义 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 onclick="setday(this,document.all.txt)">
// 二、<input onfocus="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+=" onclick="parent.meizzPrevM()" title="向前翻 1 月" ><b ><</b></td>";
strFrame+=" <td width=60 align="center" bgcolor="#63A3E9" style="font-size:12px;cursor:hand" ";
strFrame+=" onmouseover="style.backgroundColor="#aaccf3""";
strFrame+=" onmouseout="style.backgroundColor="#63A3E9"" ";
strFrame+=" onclick="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" onmouseover="style.backgroundColor="#aaccf3"" ";
strFrame+=" onmouseout="style.backgroundColor="#63A3E9"" ";
strFrame+=" onclick="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+=" onclick="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? "onmousedown="DragStart()" onmouseup="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" onclick=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" onclick="parent.meizzDayClick(this.innerText,0)"></td>";
strFrame+=" <td colspan=5 align=right style="color:#1478eb"><span onclick="parent.setNull()" style="font-size:12px;cursor: hand"";
strFrame+=" onmouseover="style.color="#ff0000"" onmouseout="style.color="#1478eb"" title="将日期置空">置空</span> <span onclick="parent.meizzToday()" style="font-size:12px;cursor: hand"";
strFrame+=" onmouseover="style.color="#ff0000"" onmouseout="style.color="#1478eb"" title="当前日期时间">当前</span> <span style="cursor:hand" id=evaAllOK onmouseover="style.color="#ff0000"" onmouseout="style.color="#1478eb"" onclick="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+=" onmouseover="style.backgroundColor="#aaccf3"" align=center onmouseout="style.backgroundColor="#63A3E9""";
strFrame+=" onclick="parent.UseTime(this)">";
strFrame+=" <span></span></td>";
strFrame+=" <td style="cursor:hand" onclick="parent.tmpSelectHourInnerHTML(this.innerText.length==3?this.innerText.substring(0,1):this.innerText.substring(0,2))"";
strFrame+=" onmouseover="style.backgroundColor="#aaccf3"" onmouseout="style.backgroundColor="#63A3E9""";
strFrame+=" title="点击这里选择时间" align=center width=50>" ;
strFrame+=" <span id=meizzHourHead></span></td>";
strFrame+=" <td style="cursor:hand" onclick="parent.tmpSelectMinuteInnerHTML(this.innerText.length==3?this.innerText.substring(0,1):this.innerText.substring(0,2))"";
strFrame+=" onmouseover="style.backgroundColor="#aaccf3"" onmouseout="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 += "onblur="document.all.tmpSelectYearLayer.style.display="none"" "
s += "onchange="document.all.tmpSelectYearLayer.style.display="none";"
s += "parent.meizzTheYear = this.value; parent.meizzSetDay(parent.meizzTheYear,parent.meizzTheMonth)">
";
var selectInnerHTML = s;
for (var i = n; i < n + 101; i++)
{
if (i == m)
{selectInnerHTML += "<option value="" + i + "" selected>" + i + "年" + "</option>
";}
else {selectInnerHTML += "<option value="" + i + "">" + i + "年" + "</option>
";}
}
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 += "onblur="document.all.tmpSelectMonthLayer.style.display="none"" "
s += "onchange="document.all.tmpSelectMonthLayer.style.display="none";"
s += "parent.meizzTheMonth = this.value; parent.meizzSetDay(parent.meizzTheYear,parent.meizzTheMonth)">
";
var selectInnerHTML = s;
for (var i = 1; i < 13; i++)
{
if (i == m)
{selectInnerHTML += "<option value=""+i+"" selected>"+i+"月"+"</option>
";}
else {selectInnerHTML += "<option value=""+i+"">"+i+"月"+"</option>
";}
}
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 += "onblur="document.all.tmpSelectHourLayer.style.display="none"" "
s += "onchange="document.all.tmpSelectHourLayer.style.display="none";"
s += "parent.meizzTheHour = this.value; parent.evaSetTime(parent.meizzTheHour,parent.meizzTheMinute);">
";
var selectInnerHTML = s;
for (var i = 0; i < 24; i++)
{
if (i == m)
{selectInnerHTML += "<option value=""+i+"" selected> "+i+" </option>
";}
else {selectInnerHTML += "<option value=""+i+""> "+i+" </option>
";}
}
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 += "onblur="document.all.tmpSelectMinuteLayer.style.display="none"" "
s += "onchange="document.all.tmpSelectMinuteLayer.style.display="none";"
s += "parent.meizzTheMinute = this.value; parent.evaSetTime(parent.meizzTheHour,parent.meizzTheMinute);">
";
var selectInnerHTML = s;
for (var i = 0; i < 60; i++)
{
if (i == m)
{selectInnerHTML += "<option value=""+i+"" selected> "+i+" </option>
";}
else {selectInnerHTML += "<option value=""+i+""> "+i+" </option>
";}
}
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.onclick=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.onclick=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.onclick=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" onclick="new Calendar().show(this);" readonly="readonly" />
// <input type="button" name="button" id="button" value="button" onclick="new Calendar().show(this.form.control_date);" /></span>
// <span>至
// <input name="control_date2" type="text" id="control_date2" size="10"
// maxlength="10" onclick="new Calendar().show(this);" readonly="readonly" />
// <input type="button" name="button" id="button1" value="button" onclick="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" : [
["u4e00u6708","u4e8cu6708","u4e09u6708","u56dbu6708","u4e94u6708","u516du6708","u4e03u6708","u516bu6708","u4e5du6708","u5341u6708","u5341u4e00u6708","u5341u4e8cu6708"],
["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],
["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"],
["u4e00u6708","u4e8cu6708","u4e09u6708","u56dbu6708","u4e94u6708","u516du6708","u4e03u6708","u516bu6708","u4e5du6708","u5341u6708","u5341u4e00u6708","u5341u4e8cu6708"]
],
"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" : ["u6e05u7a7a", "Clear", "Clear", "u6e05u7a7a"],
"today" : ["u4ecau5929", "Today", "Today", "u4ecau5929"],
"close" : ["u5173u95ed", "Close", "Close", "u95dcu9589"],
"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+" : "u65e5u4e00u4e8cu4e09u56dbu4e94u516d".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</tit声明：该文观点仅代表作者本人，入门客AI创业平台信息发布平台仅提供信息存储空间服务，如有疑问请联系rumenke@qq.com。
- 上一篇：没有了
- 下一篇：没有了
