当前文件路径：CalendarDemo/Demo/51aspxResource/Calendar.js 
1
<!--
2var mainIFrame = null;
3var exIFrame = null;
4
5var tableDate = null;
6var imgCurrent = null;
7var _bCanHide = true;
8var _bHaveUpdated = false;
9var _bHaveShown = false;
10
11var _bHaveSelectNewValue = false;
12
13var pressWhickTextBox =null;
14
15// 声明 年、月、日、时、分 的变量
16//５１ａｓpｘ
17
18var _dCurYear = null;
19var _dCurMonth = null;
20var _dCurDay = null;
21var _dCurHour = null;
22var _dCurMinute= null;
23
24var objDate =null;
25var objYear =null;
26var objMonth=null;
27var objDay =null;
28var objHour =null;
29var objMinute =null;
30
31var dateValue = "";
32var dateName ="";
33var strMonth ="";
34var strYear ="";
35var isReSet = false;
36
37var iWidth = 330; // 日历的宽度
38
39
40var iHeight= 166; // 日历的高度 (不可变)
41
42var _nShadowLength = 8;
43
44var _sNeededFilePath = _DatePickerImagePath;
45
46var _sBrowserVersion = navigator.appVersion.substring(navigator.appVersion.indexOf("MSIE") + 5,navigator.appVersion.indexOf("Windows") - 2);
47var ieVer55 = _sBrowserVersion >= 5.5 ? true : false;
48
49// 定义所需图片
50var imageReset1 = new Image();
51 imageReset1.src = _sNeededFilePath + "reset1.gif";
52var imageReset2 = new Image();
53 imageReset2.src = _sNeededFilePath + "reset2.gif";
54var imageUpDownYear = new Image();
55 imageUpDownYear.src = _sNeededFilePath + "btnYears.gif";
56var imageToday1 = new Image();
57 imageToday1.src = _sNeededFilePath + "bgToday1.gif";
58var frameCssPath = _DatePickerCssPath;
59
60var _monthDays = new Array(12);
61 _monthDays[ 0] = 31;
62 _monthDays[ 1] = 28;
63
/**//*
64
bug:未考虑润年2月份可以为29天的情况 ----find by 翟雪东
65
*/
66 _monthDays[ 2] = 31;
67 _monthDays[ 3] = 30;
68 _monthDays[ 4] = 31;
69 _monthDays[ 5] = 30;
70 _monthDays[ 6] = 31;
71 _monthDays[ 7] = 31;
72 _monthDays[ 8] = 30;
73 _monthDays[ 9] = 31;
74 _monthDays[10] = 30;
75 _monthDays[11] = 31;
76
77var _weeks = new Array(7);
78 _weeks[0] = "日";
79 _weeks[1] = "一";
80 _weeks[2] = "二";
81 _weeks[3] = "三";
82 _weeks[4] = "四";
83 _weeks[5] = "五";
84 _weeks[6] = "六";
85
86var _months = new Array(12);
87 _months[ 0] = "1";
88 _months[ 1] = "2";
89 _months[ 2] = "3";
90 _months[ 3] = "4";
91 _months[ 4] = "5";
92 _months[ 5] = "6";
93 _months[ 6] = "7";
94 _months[ 7] = "8";
95 _months[ 8] = "9";
96 _months[ 9] = "10";
97 _months[10] = "11";
98 _months[11] = "12";
99
100var defaultDate = new Date();
101
102
103var _docClick = null;
104function GetCalendar(imgClick,name, year, month, day)...{
105 if(_bHaveUpdated && imgClick == imgCurrent) return;
106
107 _docClick = document.onclick;
108 document.onclick = hideCldTabFrm;
109
110 objYear =document.getElementById(name + "_year");
111 objMonth=document.getElementById(name + "_month");
112 objDay =document.getElementById(name + "_day");
113 objHour =document.getElementById(name + "_hour");
114 objMinute=document.getElementById(name + "_minute");
115 objDate =document.getElementById(name);
116
117 exIFrame = document.all("iFrmCalendar");
118 exIFrame.style.position = "absolute";
119
120 dateValue = objDate.value;
121 _bHaveSelectNewValue = false;
122
123 this.hidDate = (imgClick == null ? document.body : imgClick);
124 var _oldDate = objDate.value;
125
126 var _tmpDate = getValidateDate(_oldDate);
127 this._year = _tmpDate.getFullYear();
128 this._month = _tmpDate.getMonth();
129 this._day = _tmpDate.getDate();
130
131 _dCurYear = this._year;
132 _dCurMonth = this._month;
133 _dCurDay = this._day;
134
135 _dCurHour = (objHour==null) ? null : (objHour.value=="" ? 0 : parseInt(objHour.value));
136 _dCurMinute = (objMinute==null) ? null : (objMinute.value=="" ? 0 : parseInt(objMinute.value) );
137
138 if(tableDate == null)
139
...{
140 this.createFrame();
141 InitDropMonth();
142 InitDropYear(true);
143
}
144 exIFrame.style.display = "inline";
145 if(!_bHaveShown || imgClick != imgCurrent) this.Orientation();
146
147 this.fillCldTabFrm(this._year, this._month, this._day);
148
149
150 if(!ieVer55)...{
151 removeShadowDiv();
152 MakeDivShadowEffect(tableDate, '#aaaaaa', _nShadowLength);
153 }
154 imgCurrent = imgClick;
155
156 _bHaveUpdated = true;
157 _bHaveShown = true;
158}
159
160
161function createFrame()...{
162 // HTML的基本信息(head body)
163 var _sz = "<HTML>"
164 + "<HEAD><link href='" + frameCssPath +"' rel=stylesheet type='text/css'>"
165 + "<meta http-equiv=\"Content-Type\" content=\"text/html; charset=gb2312\"></HEAD>"
166 + "<BODY onselectstart='return false;' leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0 style='cursor:default;background-color:transparent;border:0px solid black;scroll:no'>"
167 + "</BODY></HTML>";
168
169 mainIFrame = iFrmCalendar;
170
171 if(ieVer55)
172 exIFrame.style.filter = "progid:DXImageTransform.Microsoft.Shadow(direction=135,color=#aaaaaa,strength=" + _nShadowLength + ")";
173
174 mainIFrame.document.open("text/html","replace");
175 mainIFrame.document.write(_sz);
176 mainIFrame.document.close();
177
178 // table
179 tableDate = mainIFrame.document.createElement("TABLE");
180 mainIFrame.document.body.insertBefore(tableDate);
181 exIFrame.style.display = "inline";
182 exIFrame.style.zIndex = "10";
183
184 tableDate.id = "GreatCalendar"
185 tableDate.style.position = "absolute";
186 tableDate.className = "calendar";
187 tableDate.border = 0;
188
189 tableDate.style.pixelWidth = iWidth ;
190 tableDate.cellSpacing = 1;
191 tableDate.cellPadding = 1;
192 tableDate.bgColor = "ffffff";
193 tableDate.attachEvent("onmouseover", whenMouseOverCldTabFrm);
194 tableDate.attachEvent("onmouseout", whenMouseOutCldTabFrm);
195
196 var _TR = tableDate.insertRow();
197 var _TD = _TR.insertCell();
198 _TD.colSpan = 7;
199 _TD.align = "center";
200 _TD.innerHTML = " ";
201 // 关键部份 7*7
202 for(var i = 0; i < 7; i++)...{
203 _TR = tableDate.insertRow();
204 for(var j = 0; j < 7; j++)...{
205 _TD = _TR.insertCell();
206 _TD.style.cursor = "default";
207 _TD.align = "center";
208 _TD.width = 50;
209 _TD.innerHTML = "*";
210 if(i != 0)...{
211 _TD.style.cursor = "hand";
212 _TD.attachEvent("onmouseover", whenMouseOverDateItem);
213 _TD.attachEvent("onmouseout", whenMouseOutDateItem);
214 _TD.attachEvent("onclick", whenClickDateItem);
215 }
216 if(i == 0) _TD.innerHTML = "<b>" + _weeks[j] + "</b>";
217 if(i == 0 && (j == 0 || j == 6)) _TD.className = "tdHoliday";
218 }
219 }
220 // 最后一行(today cancel)
221 _TR = tableDate.insertRow(2);
222 _TD = _TR.insertCell();
223 _TD.colSpan = 7;
224 _TD.height = 1;
225 _TD.bgColor = "black";
226 _TR = tableDate.insertRow();
227 _TD = _TR.insertCell();
228 _TD.colSpan = 7;
229 _TD.innerHTML = "<table cellspacing=0 cellpadding=0 class=calendar style='border:0px solid;width:100%'>"
230 + "<tr><td width=160 title= '转到今天 | Switch to today.'style='cursor:hand'onclick=\"parent._bHaveSelectNewValue=true;parent.setTargetFormaValue(" + defaultDate.getFullYear() + "," + (defaultDate.getMonth()) + "," + defaultDate.getDate() + ");parent.hideCldTabFrm();return;parent.fillCldTabFrm(" + defaultDate.getFullYear() + "," + defaultDate.getMonth() + "," + defaultDate.getDate() +");\">"
231 + "<b> <img src='" + imageToday1.src + "' width=30px> 今 天 : " + defaultDate.getFullYear() + "-" + (defaultDate.getMonth() + 1) + "-" + defaultDate.getDate()
232 + "</td>"
233 + "<td width=30>"
234 + "<img style='cursor:hand' onclick=parent.resetTargetValue() title='清空日期 | clear the target value.' src='" + imageReset1.src + "' onmouseover=this.src='" + imageReset2.src + "' onmouseout=this.src='" + imageReset1.src + "'></td>"
235 + "<td> </td></tr></table>";
236
237}
238
239function InitDropMonth()
240...{
241 strMonth =" <select valign=\"top\" id=\"dropMonth\" onmouseout='parent.HideMonthDrop();' onchange=\"return parent.ChangeMonth(this);\" style=\"display:none;FONT-SIZE:12px;WIDTH:70px;HEIGHT:20px\" accesskey=\"M\" bordercolor=\"#e0e3f7\">"+
242 "<OPTION class='dropItem' value =\"0\" selected>一月</OPTION>"+
243 "<OPTION class='dropItem' value =\"1\">二月</OPTION>"+
244 "<OPTION class='dropItem' value =\"2\">三月</OPTION>"+
245 "<OPTION class='dropItem' value =\"3\">四月</OPTION>"+
246 "<OPTION class='dropItem' value =\"4\">五月</OPTION>"+
247 "<OPTION class='dropItem' value =\"5\">六月</OPTION>"+
248 "<OPTION class='dropItem' value =\"6\">七月</OPTION>"+
249 "<OPTION class='dropItem' value =\"7\">八月</OPTION>"+
250 "<OPTION class='dropItem' value =\"8\">九月</OPTION>"+
251 "<OPTION class='dropItem' value =\"9\">十月</OPTION>"+
252 "<OPTION class='dropItem' value =\"10\">十一月</OPTION>"+
253 "<OPTION class='dropItem' value =\"11\">十二月</OPTION>"+
254 "</select>";
255}
256
257function InitDropYear(isFirstTime)
258...{
259 var year = parseInt(_dCurYear);
260 if(isFirstTime)
261 ...{
262 strYear =" <select valign=\"top\" id=\"dropYear\" onmouseout='parent.HideYearDrop();' onchange=\"return parent.ChangeYear(this);\" style=\"display:none;FONT-SIZE:12px;WIDTH:70px;HEIGHT:20px\" accesskey=\"M\" bordercolor=\"#e0e3f7\">"
263 strYear +="</select>";
264 }
265 else
266 ...{
267 for(var i = year -25;i< year +10;i++)
268 ...{
269 var item = mainIFrame.document.createElement("option");
270 mainIFrame.dropYear.options.add(item);
271 item.innerText =i+ " 年";
272 item.value = i;
273 item.className ="dropItem";
274 if(year ==i)
275 item.selected =true;
276 }
277 }
278 }
279
280function fillCldTabFrm(year, month, day)...{
281 var dCurDate = 0;
282 var dNextMonthDate = 1;
283 var iDateStartRow = 3;
284 var _d = new Date(year, month, 1);
285 var _day = _d.getDay();
286 var _td = null;
287
288 _dCurYear = year;
289 _dCurMonth = month;
290 _dCurDay = day;
291
292 if (((_dCurYear % 4 == 0) && !(_dCurYear % 100 == 0))
293 ||(_dCurYear % 400 == 0)) _monthDays[1] = 29;
294 else _monthDays[1] = 28;
295
296
297 // 初始化头 (年月部份)
298 tableDate.rows(0).cells(0).innerHTML
299 = "<table bgcolor=#420042 class=calendar style=\"color:white;font-weight:bolder;border:0px solid;width:100%;height:20px;\" cellspacing=0 cellpadding=0>"
300 + "<tr><td width=10% height=22>"
301 + " <a style='cursor:hand' title='上月份' onclick=\"parent.switchLastMonth()\"><<</a>"
302 + "</td>"
303 + "<td align=right vAlign=middle width=40%>"
304 + strYear
305
