怎么样使用梅花雨的js日历控件?
calendar.js脚本为:
<!--
document.write("<divid=meizzCalendarLayerstyle='position:absolute;z-index:9999;width:144;height:193;display:none'>");
document.write("<iframename=meizzCalendarIframescrolling=noframeborder=0width=100%height=100%></iframe></div>");
functionwriteIframe()
{
varstrIframe="<html><head><metahttp-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:142;height:180;}"+
"table#tableWeektd{color:"+WebCalendar.lightColor+";}"+
"table#tableDaytd{font-weight:bold;}"+
"td#meizzYearHead,td#meizzYearMonth{color:"+WebCalendar.wordColor+"}"+
".out{text-align:center;border-top:1pxsolid"+WebCalendar.DarkBorder+";border-left:1pxsolid"+WebCalendar.DarkBorder+";"+
"border-right:1pxsolid"+WebCalendar.lightColor+";border-bottom:1pxsolid"+WebCalendar.lightColor+";}"+
".over{text-align:center;border-top:1pxsolid#FFFFFF;border-left:1pxsolid#FFFFFF;"+
"border-bottom:1pxsolid"+WebCalendar.DarkBorder+";border-right:1pxsolid"+WebCalendar.DarkBorder+"}"+
"input{border:1pxsolid"+WebCalendar.darkColor+";padding-top:1px;height:18;cursor:hand;"+
"color:"+WebCalendar.wordColor+";background-color:"+WebCalendar.btnBgColor+"}"+
"</style></head><bodyonselectstart='returnfalse'style='margin:0px'oncontextmenu='returnfalse'><formname=meizz>";
if(WebCalendar.drag){strIframe+="<scr"+"iptlanguage=javascript>"+
"vardrag=false,cx=0,cy=0,o=parent.WebCalendar.calendar;functiondocument.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;}}"+
"functiondocument.onkeydown(){switch(window.event.keyCode){case27:parent.hiddenCalendar();break;"+
"case37:parent.prevM();break;case38:parent.prevY();break;case39:parent.nextM();break;case40:parent.nextY();break;"+
"case84:document.forms[0].today.click();break;}window.event.keyCode=0;window.event.returnValue=false;}"+
"functiondragStart(){cx=window.event.clientX;cy=window.event.clientY;drag=true;}</scr"+"ipt>"}
strIframe+="<selectname=tmpYearSelectonblur='parent.hiddenSelect(this)'style='z-index:1;position:absolute;top:3;left:18;display:none'"+
"onchange='parent.WebCalendar.thisYear=this.value;parent.hiddenSelect(this);parent.writeCalendar();'></select>"+
"<selectname=tmpMonthSelectonblur='parent.hiddenSelect(this)'style='z-index:1;position:absolute;top:3;left:74;display:none'"+
"onchange='parent.WebCalendar.thisMonth=this.value;parent.hiddenSelect(this);parent.writeCalendar();'></select>"+
"<tableid=tableMainclass=bgborder=0cellspacing=2cellpadding=0>"+
"<tr><tdwidth=140height=19bgcolor='"+WebCalendar.lightColor+"'>"+
"<tablewidth=140id=tableHeadborder=0cellspacing=1cellpadding=0><tralign=center>"+
"<tdwidth=15height=19class=bgtitle='向前翻1月 快捷键:←'style='cursor:hand'onclick='parent.prevM()'><b><</b></td>"+
"<tdwidth=60id=meizzYearHeadtitle='点击此处选择年份'onclick='parent.funYearSelect(parseInt(this.innerText,10))'"+
"onmouseover='this.bgColor=parent.WebCalendar.darkColor;this.style.color=parent.WebCalendar.lightColor'"+
"onmouseout='this.bgColor=parent.WebCalendar.lightColor;this.style.color=parent.WebCalendar.wordColor'></td>"+
"<tdwidth=50id=meizzYearMonthtitle='点击此处选择月份'onclick='parent.funMonthSelect(parseInt(this.innerText,10))'"+
"onmouseover='this.bgColor=parent.WebCalendar.darkColor;this.style.color=parent.WebCalendar.lightColor'"+
"onmouseout='this.bgColor=parent.WebCalendar.lightColor;this.style.color=parent.WebCalendar.wordColor'></td>"+
"<tdwidth=15class=bgtitle='向后翻1月 快捷键:→'onclick='parent.nextM()'style='cursor:hand'><b>></b></td></tr></table>"+
"</td></tr><tr><tdheight=20><tableid=tableWeekborder=1width=140cellpadding=0cellspacing=0";
if(WebCalendar.drag){strIframe+="onmousedown='dragStart()'onmouseup='drag=false'onmouseout='drag=false'";}
strIframe+="borderColorLight='"+WebCalendar.darkColor+"'borderColorDark='"+WebCalendar.lightColor+"'>"+
"<tralign=center><tdheight=20>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></table>"+
"</td></tr><tr><tdvalign=topwidth=140bgcolor='"+WebCalendar.lightColor+"'>"+
"<tableid=tableDayheight=120width=140border=0cellspacing=1cellpadding=0>";
for(varx=0;x<5;x++){strIframe+="<tr>";
for(vary=0;y<7;y++)strIframe+="<tdclass=outid='meizzDay"+(x*7+y)+"'></td>";strIframe+="</tr>";}
strIframe+="<tr>";
for(varx=35;x<39;x++)strIframe+="<tdclass=outid='meizzDay"+x+"'></td>";
strIframe+="<tdcolspan=3class=outtitle='"+WebCalendar.regInfo+"'><inputstyle='background-color:"+
WebCalendar.btnBgColor+";cursor:hand;padding-top:4px;width:100%;height:100%;border:0'onfocus='this.blur()'"+
"type=buttonvalue=' 关闭'onclick='parent.hiddenCalendar()'></td></tr></table>"+
"</td></tr><tr><tdheight=20width=140bgcolor='"+WebCalendar.lightColor+"'>"+
"<tableborder=0cellpadding=1cellspacing=0width=140>"+
"<tr><td><inputname=prevYeartitle='向前翻1年 快捷键:↑'onclick='parent.prevY()'type=buttonvalue='<<'"+
"onfocus='this.blur()'style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==1000)'><input"+
"onfocus='this.blur()'name=prevMonthtitle='向前翻1月 快捷键:←'onclick='parent.prevM()'type=buttonvalue='< '>"+
"</td><tdalign=center><inputname=todaytype=buttonvalue='Today'onfocus='this.blur()'style='width:50'title='当前日期 快捷键:T'"+
"onclick="parent.returnDate(newDate().getDate()+'/'+(newDate().getMonth()+1)+'/'+newDate().getFullYear())">"+
"</td><tdalign=right><inputtitle='向后翻1月 快捷键:→'name=nextMonthonclick='parent.nextM()'type=buttonvalue=' >'"+
"onfocus='this.blur()'><inputname=nextYeartitle='向后翻1年 快捷键:↓'onclick='parent.nextY()'type=buttonvalue='>>'"+
"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(vari=0;i<39;i++)
{
WebCalendar.dayObj[i]=eval("meizzDay"+i);
WebCalendar.dayObj[i].onmouseover=dayMouseOver;
WebCalendar.dayObj[i].onmouseout=dayMouseOut;
WebCalendar.dayObj[i].onclick=returnDate;
}
}
}
functionWebCalendar()//初始化日历的设置
{
this.regInfo="WEBCalendarver3.0 作者:meizz(梅花雪疏影横斜) 网站:http://www.meizz.com/ 关闭的快捷键:[Esc]";
this.regInfo+=" Ver2.0:walkingpoison(水晶龙) Ver1.0:meizz(梅花雪疏影横斜)";
this.daysMonth=newArray(31,28,31,30,31,30,31,31,30,31,30,31);
this.day=newArray(39);//定义日历展示用的数组
this.dayObj=newArray(39);//定义日期展示控件数组
this.dateStyle=null;//保存格式化后日期数组
this.objExport=null;//日历回传的显示控件
this.eventSrc=null;//日历显示的触发控件
this.inputDate=null;//转化外的输入的日期(d/m/yyyy)
this.thisYear=newDate().getFullYear();//定义年的变量的初始值
this.thisMonth=newDate().getMonth()+1;//定义月的变量的初始值
this.thisDay=newDate().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;//定义年下拉框的年差值
this.format="yyyy-mm-dd";//回传日期的格式
this.timeShow=false;//是否返回时间
this.drag=true;//是否允许拖动
this.darkColor="#FF6347";//控件的暗色
this.lightColor="#FFFFFF";//控件的亮色
this.btnBgColor="#FFF5A0";
document.write("<divid=meizzCalendarLayerstyle='position:absolute;z-index:9999;width:144;height:193;display:none'>");
document.write("<iframename=meizzCalendarIframescrolling=noframeborder=0width=100%height=100%></iframe></div>");
functionwriteIframe()
{
varstrIframe="<html><head><metahttp-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:142;height:180;}"+
"table#tableWeektd{color:"+WebCalendar.lightColor+";}"+
"table#tableDaytd{font-weight:bold;}"+
"td#meizzYearHead,td#meizzYearMonth{color:"+WebCalendar.wordColor+"}"+
".out{text-align:center;border-top:1pxsolid"+WebCalendar.DarkBorder+";border-left:1pxsolid"+WebCalendar.DarkBorder+";"+
"border-right:1pxsolid"+WebCalendar.lightColor+";border-bottom:1pxsolid"+WebCalendar.lightColor+";}"+
".over{text-align:center;border-top:1pxsolid#FFFFFF;border-left:1pxsolid#FFFFFF;"+
"border-bottom:1pxsolid"+WebCalendar.DarkBorder+";border-right:1pxsolid"+WebCalendar.DarkBorder+"}"+
"input{border:1pxsolid"+WebCalendar.darkColor+";padding-top:1px;height:18;cursor:hand;"+
"color:"+WebCalendar.wordColor+";background-color:"+WebCalendar.btnBgColor+"}"+
"</style></head><bodyonselectstart='returnfalse'style='margin:0px'oncontextmenu='returnfalse'><formname=meizz>";
if(WebCalendar.drag){strIframe+="<scr"+"iptlanguage=javascript>"+
"vardrag=false,cx=0,cy=0,o=parent.WebCalendar.calendar;functiondocument.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;}}"+
"functiondocument.onkeydown(){switch(window.event.keyCode){case27:parent.hiddenCalendar();break;"+
"case37:parent.prevM();break;case38:parent.prevY();break;case39:parent.nextM();break;case40:parent.nextY();break;"+
"case84:document.forms[0].today.click();break;}window.event.keyCode=0;window.event.returnValue=false;}"+
"functiondragStart(){cx=window.event.clientX;cy=window.event.clientY;drag=true;}</scr"+"ipt>"}
strIframe+="<selectname=tmpYearSelectonblur='parent.hiddenSelect(this)'style='z-index:1;position:absolute;top:3;left:18;display:none'"+
"onchange='parent.WebCalendar.thisYear=this.value;parent.hiddenSelect(this);parent.writeCalendar();'></select>"+
"<selectname=tmpMonthSelectonblur='parent.hiddenSelect(this)'style='z-index:1;position:absolute;top:3;left:74;display:none'"+
"onchange='parent.WebCalendar.thisMonth=this.value;parent.hiddenSelect(this);parent.writeCalendar();'></select>"+
"<tableid=tableMainclass=bgborder=0cellspacing=2cellpadding=0>"+
"<tr><tdwidth=140height=19bgcolor='"+WebCalendar.lightColor+"'>"+
"<tablewidth=140id=tableHeadborder=0cellspacing=1cellpadding=0><tralign=center>"+
"<tdwidth=15height=19class=bgtitle='向前翻1月 快捷键:←'style='cursor:hand'onclick='parent.prevM()'><b><</b></td>"+
"<tdwidth=60id=meizzYearHeadtitle='点击此处选择年份'onclick='parent.funYearSelect(parseInt(this.innerText,10))'"+
"onmouseover='this.bgColor=parent.WebCalendar.darkColor;this.style.color=parent.WebCalendar.lightColor'"+
"onmouseout='this.bgColor=parent.WebCalendar.lightColor;this.style.color=parent.WebCalendar.wordColor'></td>"+
"<tdwidth=50id=meizzYearMonthtitle='点击此处选择月份'onclick='parent.funMonthSelect(parseInt(this.innerText,10))'"+
"onmouseover='this.bgColor=parent.WebCalendar.darkColor;this.style.color=parent.WebCalendar.lightColor'"+
"onmouseout='this.bgColor=parent.WebCalendar.lightColor;this.style.color=parent.WebCalendar.wordColor'></td>"+
"<tdwidth=15class=bgtitle='向后翻1月 快捷键:→'onclick='parent.nextM()'style='cursor:hand'><b>></b></td></tr></table>"+
"</td></tr><tr><tdheight=20><tableid=tableWeekborder=1width=140cellpadding=0cellspacing=0";
if(WebCalendar.drag){strIframe+="onmousedown='dragStart()'onmouseup='drag=false'onmouseout='drag=false'";}
strIframe+="borderColorLight='"+WebCalendar.darkColor+"'borderColorDark='"+WebCalendar.lightColor+"'>"+
"<tralign=center><tdheight=20>日</td><td>一</td><td>二</td><td>三</td><td>四</td><td>五</td><td>六</td></tr></table>"+
"</td></tr><tr><tdvalign=topwidth=140bgcolor='"+WebCalendar.lightColor+"'>"+
"<tableid=tableDayheight=120width=140border=0cellspacing=1cellpadding=0>";
for(varx=0;x<5;x++){strIframe+="<tr>";
for(vary=0;y<7;y++)strIframe+="<tdclass=outid='meizzDay"+(x*7+y)+"'></td>";strIframe+="</tr>";}
strIframe+="<tr>";
for(varx=35;x<39;x++)strIframe+="<tdclass=outid='meizzDay"+x+"'></td>";
strIframe+="<tdcolspan=3class=outtitle='"+WebCalendar.regInfo+"'><inputstyle='background-color:"+
WebCalendar.btnBgColor+";cursor:hand;padding-top:4px;width:100%;height:100%;border:0'onfocus='this.blur()'"+
"type=buttonvalue=' 关闭'onclick='parent.hiddenCalendar()'></td></tr></table>"+
"</td></tr><tr><tdheight=20width=140bgcolor='"+WebCalendar.lightColor+"'>"+
"<tableborder=0cellpadding=1cellspacing=0width=140>"+
"<tr><td><inputname=prevYeartitle='向前翻1年 快捷键:↑'onclick='parent.prevY()'type=buttonvalue='<<'"+
"onfocus='this.blur()'style='meizz:expression(this.disabled=parent.WebCalendar.thisYear==1000)'><input"+
"onfocus='this.blur()'name=prevMonthtitle='向前翻1月 快捷键:←'onclick='parent.prevM()'type=buttonvalue='< '>"+
"</td><tdalign=center><inputname=todaytype=buttonvalue='Today'onfocus='this.blur()'style='width:50'title='当前日期 快捷键:T'"+
"onclick="parent.returnDate(newDate().getDate()+'/'+(newDate().getMonth()+1)+'/'+newDate().getFullYear())">"+
"</td><tdalign=right><inputtitle='向后翻1月 快捷键:→'name=nextMonthonclick='parent.nextM()'type=buttonvalue=' >'"+
"onfocus='this.blur()'><inputname=nextYeartitle='向后翻1年 快捷键:↓'onclick='parent.nextY()'type=buttonvalue='>>'"+
"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(vari=0;i<39;i++)
{
WebCalendar.dayObj[i]=eval("meizzDay"+i);
WebCalendar.dayObj[i].onmouseover=dayMouseOver;
WebCalendar.dayObj[i].onmouseout=dayMouseOut;
WebCalendar.dayObj[i].onclick=returnDate;
}
}
}
functionWebCalendar()//初始化日历的设置
{
this.regInfo="WEBCalendarver3.0 作者:meizz(梅花雪疏影横斜) 网站:http://www.meizz.com/ 关闭的快捷键:[Esc]";
this.regInfo+=" Ver2.0:walkingpoison(水晶龙) Ver1.0:meizz(梅花雪疏影横斜)";
this.daysMonth=newArray(31,28,31,30,31,30,31,31,30,31,30,31);
this.day=newArray(39);//定义日历展示用的数组
this.dayObj=newArray(39);//定义日期展示控件数组
this.dateStyle=null;//保存格式化后日期数组
this.objExport=null;//日历回传的显示控件
this.eventSrc=null;//日历显示的触发控件
this.inputDate=null;//转化外的输入的日期(d/m/yyyy)
this.thisYear=newDate().getFullYear();//定义年的变量的初始值
this.thisMonth=newDate().getMonth()+1;//定义月的变量的初始值
this.thisDay=newDate().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;//定义年下拉框的年差值
this.format="yyyy-mm-dd";//回传日期的格式
this.timeShow=false;//是否返回时间
this.drag=true;//是否允许拖动
this.darkColor="#FF6347";//控件的暗色
this.lightColor="#FFFFFF";//控件的亮色
this.btnBgColor="#FFF5A0";
本文地址:http://www.45fan.com/dnjc/71717.html