js兑现日历
日期：2014-05-16 浏览次数：20336 次
?<!--
/* 调用方法：
? <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 "+ WebCa
