能够选择时间的 JS 日历时间输入控件

主调用函数是 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)">

手动调整了 分 和 秒 的初始值为0,也可手动调整回取现在时间得 分 和 秒

// 主调用函数是setday(this,[object])和setday(this)，[object]是控件输出的控件名，举两个例子：
// 一、<inputname=txt><inputtype=buttonvalue=setdayοnclick="setday(this,document.all.txt)">
// 二、<inputοnfοcus="setday(this)">

var bMoveable = true ;
var strFrame;

document.writeln( ' <iframeid=endDateLayerframeborder=0width=180height=220style="position:absolute;z-index:9998;display:none"></iframe> ' );
strFrame = ' <style> ' ;
strFrame += ' INPUT.button{BORDER-RIGHT:#63A3E91pxsolid;BORDER-TOP:#63A3E91pxsolid;BORDER-LEFT:#63A3E91pxsolid; ' ;
strFrame += ' BORDER-BOTTOM:#63A3E91pxsolid;BACKGROUND-COLOR:#63A3E9;font-family:宋体;} ' ;
strFrame += ' TD{FONT-SIZE:9pt;font-family:宋体;} ' ;
strFrame += ' </style> ' ;
strFrame += ' <scr ' + ' ipt> ' ;
strFrame += ' vardatelayerx,datelayery; ' ;
strFrame += ' varbDrag; ' ;
strFrame += ' functiondocument.onmousemove() ' ;
strFrame += ' {if(bDrag&&window.event.button==1) ' ;
strFrame += ' {varDateLayer=parent.document.all.endDateLayer.style; ' ;
strFrame += ' DateLayer.posLeft+=window.event.clientX-datelayerx; ' ;
strFrame += ' DateLayer.posTop+=window.event.clientY-datelayery;}} ' ;
strFrame += ' functionDragStart() ' ;
strFrame += ' {varDateLayer=parent.document.all.endDateLayer.style; ' ;
strFrame += ' datelayerx=window.event.clientX; ' ;
strFrame += ' datelayery=window.event.clientY; ' ;
strFrame += ' bDrag=true;} ' ;
strFrame += ' functionDragEnd(){ ' ;
strFrame += ' bDrag=false;} ' ;
strFrame += ' </scr ' + ' ipt> ' ;
strFrame += ' <divstyle="z-index:9999;position:absolute;left:0;top:0;"onselectstart="returnfalse"> ' ;
strFrame += ' <spanid=tmpSelectYearLayerstyle="z-index:9999;position:absolute;top:3;left:19;display:none"></span> ' ;
strFrame += ' <spanid=tmpSelectMonthLayerstyle="z-index:9999;position:absolute;top:3;left:78;display:none"></span> ' ;
strFrame += ' <spanid=tmpSelectHourLayerstyle="z-index:9999;position:absolute;top:188;left:35px;display:none"></span> ' ;
strFrame += ' <spanid=tmpSelectMinuteLayerstyle="z-index:9999;position:absolute;top:188;left:77px;display:none"></span> ' ;
strFrame += ' <spanid=tmpSelectSecondLayerstyle="z-index:9999;position:absolute;top:188;left:119px;display:none"></span> ' ;
strFrame += ' <tableborder=1cellspacing=0cellpadding=0width=142height=160bordercolor=#63A3E9bgcolor=#63A3E9> ' ;
strFrame += ' <tr><tdwidth=142height=23bgcolor=#FFFFFF> ' ;
strFrame += ' <tableborder=0cellspacing=1cellpadding=0width=158height=23> ' ;
strFrame += ' <tralign=center> ' ;
strFrame += ' <tdwidth=16align=centerbgcolor=#63A3E9style="font-size:12px;cursor:hand;color:#ffffff" ' ;
strFrame += ' οnclick="parent.meizzPrevM()"title="向前翻1月"><b>&lt;</b></td> ' ;
strFrame += ' <tdwidth=60align="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="点击这里选择年份"><spanid=meizzYearHead></span></td> ' ;
strFrame += ' <tdwidth=48align="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="点击这里选择月份"><spanid=meizzMonthHead></span></td> ' ;
strFrame += ' <tdwidth=16bgcolor=#63A3E9align=centerstyle="font-size:12px;cursor:hand;color:#ffffff" ' ;
strFrame += ' οnclick="parent.meizzNextM()"title="向后翻1月"><b>&gt;</b></td> ' ;
strFrame += ' </tr> ' ;
strFrame += ' </table></td></tr> ' ;
strFrame += ' <tr><tdwidth=142height=18> ' ;
strFrame += ' <tableborder=0cellspacing=0cellpadding=2bgcolor=#63A3E9 ' + (bMoveable ? ' οnmοusedοwn="DragStart()"οnmοuseup="DragEnd()" ' : '' );
strFrame += ' BORDERCOLORLIGHT=#63A3E9BORDERCOLORDARK=#FFFFFFwidth=140height=20style="cursor: ' + (bMoveable ? ' move ' : ' default ' ) + ' "> ' ;
strFrame += ' <tr><tdstyle="font-size:12px;color:#ffffff"width=20>&nbsp;日</td> ' ;
strFrame += ' <tdstyle="font-size:12px;color:#FFFFFF">&nbsp;一</td><tdstyle="font-size:12px;color:#FFFFFF">&nbsp;二</td> ' ;
strFrame += ' <tdstyle="font-size:12px;color:#FFFFFF">&nbsp;三</td><tdstyle="font-size:12px;color:#FFFFFF">&nbsp;四</td> ' ;
strFrame += ' <tdstyle="font-size:12px;color:#FFFFFF">&nbsp;五</td><tdstyle="font-size:12px;color:#FFFFFF">&nbsp;六</td></tr> ' ;
strFrame += ' </table></td></tr> ' ;
strFrame += ' <tr><tdwidth=142height=120> ' ;
strFrame += ' <tableborder=1cellspacing=2cellpadding=2BORDERCOLORLIGHT=#63A3E9BORDERCOLORDARK=#FFFFFFbgcolor=#fff8ecwidth=140height=120> ' ;
var n = 0 ; for (j = 0 ;j < 5 ;j ++ ) ... {strFrame+='<tralign=center>';for(i=0;i<7;i++)...{
strFrame+='<tdwidth=20height=20id=meizzDay'+n+'style="font-size:12px"οnclick=parent.meizzDayClick(this.innerText,0)></td>';n++;}
strFrame+='</tr>';}
strFrame += ' <tralign=center> ' ;
for (i = 35 ;i < 37 ;i ++ )strFrame += ' <tdwidth=20height=20id=meizzDay ' + i + ' style="font-size:12px"οnclick="parent.meizzDayClick(this.innerText,0)"></td> ' ;
strFrame += ' <tdcolspan=5align=rightstyle="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>&nbsp;&nbsp;<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>&nbsp;&nbsp;<spanstyle="cursor:hand"id=evaAllOKοnmοuseοver="style.color='#ff0000'"οnmοuseοut="style.color='#1478eb'"οnclick="parent.closeLayer()"title="关闭日历">关闭&nbsp;</span></td></tr> ' ;
strFrame += ' </table></td></tr><tr><td> ' ;
strFrame += ' <tableborder=0cellspacing=1cellpadding=0width=100%bgcolor=#FFFFFFheight=22> ' ;
strFrame += ' <trbgcolor="#63A3E9"><tdid=bUseTimeLayerwidth=30style="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 += ' <tdstyle="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=centerwidth=42> ' ;
strFrame += ' <spanid=meizzHourHead></span></td> ' ;
strFrame += ' <tdstyle="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=centerwidth=42> ' ;
strFrame += ' <spanid=meizzMinuteHead></span></td> ' ;
strFrame += ' <tdstyle="cursor:hand"οnclick="parent.tmpSelectSecondInnerHTML(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=centerwidth=42> ' ;
strFrame += ' <spanid=meizzSecondHead></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 bUseTime = false ; // 是否使用时间
var odatelayer = window.frames.endDateLayer.document.all; // 存放日历对象
var odatelayer = window.endDateLayer.document.all;
// odatelayer.bUseTimeLayer.innerText="NO";
bImgSwitch();
odatelayer.bUseTimeLayer.innerHTML = bImg;

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

varthei=tt.clientHeight;//TT控件本身的高
vartleft=tt.offsetLeft;//TT控件的定位点宽

varttyp=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;//设定外部点击的按钮

//根据当前输入框的日期显示日历的年月
varreg=/^(d+)-(d...{1,2})-(d...{1,2})/;//不含时间
varr=outObject.value.match(reg);
if(r!=null)...{
r[2]=r[2]-1;
vard=newDate(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(newDate().getFullYear(),newDate().getMonth()+1);
}
dads.display='';

//判断初始化时是否使用时间,非严格验证
//if(outObject.value.length>10)
//{
bUseTime=true;
bImgSwitch();
odatelayer.bUseTimeLayer.innerHTML=bImg;
meizzWriteHead(meizzTheYear,meizzTheMonth);
//}
//else
//{
//bUseTime=false;
//