1
<html>
2
3<head>
4<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
5<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
6<meta name="ProgId" content="FrontPage.Editor.Document">
7<title>New Page 1</title>
8<script language=javascript>
9var DS_x,DS_y;
10
11function dateSelector() //构造dateSelector对象，用来实现一个日历形式的日期输入框。
12
{
13
var myDate=new Date();
14
15this.year=myDate.getFullYear(); //定义year属性，年份，默认值为当前系统年份。
16this.month=myDate.getMonth()+1; //定义month属性，月份，默认值为当前系统月份。
17this.date=myDate.getDate(); //定义date属性，日，默认值为当前系统的日。
18this.inputName=\'\'; //定义inputName属性，即输入框的name，默认值为空。注意：在同一页中出现多个日期输入框，不能有重复的name！
19this.display=display; //定义display方法，用来显示日期输入框。
20
}
21
22function display() //定义dateSelector的display方法，它将实现一个日历形式的日期选择框。
23{
24var week=new Array(\'日\',\'一\',\'二\',\'三\',\'四\',\'五\',\'六\');
25
26document.write("<style type=text/css>");
27document.write(" .ds_font td,span { font: normal 12px 宋体; color: #000000; }");
28document.write(" .ds_border { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }");
29document.write(" .ds_border2 { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }");
30document.write("</style>");
31
32var M=new String(this.month);
33var d=new String(this.date);
34
35
if(M.length==1&d.length==1){
36
document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-0"+this.month+"-0"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");}
37else if(M.length==1&d.length==2){
38document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-0"+this.month+"-"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");}
39else if(M.length==2&d.length==1){
40document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-"+this.month+"-0"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");}
41else if(M.length==2&d.length==2){
42document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-"+this.month+"-"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");}
43
44document.write("<button style=\'width:60px;height:18px;font-size:12px;margin:1px;border:1px solid #A4B3C8;background-color:#DFE7EF;\' type=button onclick=this.nextSibling.style.display=\'block\' onfocus=this.blur()>选择日期</button>");
45
46document.write("<div style=\'position:absolute;display:none;text-align:center;width:0px;height:0px;overflow:visible\' onselectstart=\'return false;\'>");
47document.write(" <div style=\'position:absolute;left:-60px;top:20px;width:142px;height:165px;background-color:#F6F6F6;border:1px solid #245B7D;\' class=ds_font>");
48document.write(" <table cellpadding=0 cellspacing=1 width=140 height=20 bgcolor=#CEDAE7 onmousedown=\'DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();\' onmouseup=\'releaseCapture();\' onmousemove=\'dsMove(this.parentNode)\' style=\'cursor:move;\'>");
49document.write(" <tr align=center>");
50document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=subYear(this) title=\'减小年份\'><<</td>");
51document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=subMonth(this) title=\'减小月份\'><</td>");
52document.write(" <td width=52%><b>"+this.year+"</b><b>年</b><b>"+this.month+"</b><b>月</b></td>");
53document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=addMonth(this) title=\'增加月份\'>></td>");
54document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=addYear(this) title=\'增加年份\'>>></td>");
55document.write(" </tr>");
56document.write(" </table>");
57
58document.write(" <table cellpadding=0 cellspacing=0 width=140 height=20 onmousedown=\'DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();\' onmouseup=\'releaseCapture();\' onmousemove=\'dsMove(this.parentNode)\' style=\'cursor:move;\'>");
59document.write(" <tr align=center>");
60for(i=0;i<7;i++)
61 document.write(" <td>"+week[i]+"</td>");
62document.write(" </tr>");
63document.write(" </table>");
64
65document.write(" <table cellpadding=0 cellspacing=2 width=140 bgcolor=#EEEEEE>");
66for(i=0;i<6;i++)
67{
68document.write(" <tr align=center>");
69 for(j=0;j<7;j++)
70document.write(" <td width=10% height=16 onmouseover=if(this.innerText!=\'\'&&this.className!=\'ds_border2\')this.className=\'ds_border\' onmouseout=if(this.className!=\'ds_border2\')this.className=\'\' onclick=getValue(this,document.all(\'DS_"+this.inputName+"\'))></td>");
71document.write(" </tr>");
72}
73document.write(" </table>");
74
75document.write(" <span style=cursor:hand onclick=this.parentNode.parentNode.style.display=\'none\'>【关闭】</span>");
76document.write(" </div>");
77document.write("</div>");
78
79dateShow(document.all("DS_"+this.inputName).nextSibling.nextSibling.childNodes[0].childNodes[2],this.year,this.month)
80}
81
82function subYear(obj) //减小年份
83{
84var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
85myObj[0].innerHTML=eval(myObj[0].innerHTML)-1;
86dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
87}
88
89function addYear(obj) //增加年份
90{
91var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
92myObj[0].innerHTML=eval(myObj[0].innerHTML)+1;
93dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
94}
95
96function subMonth(obj) //减小月份
97{
98var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
99var month=eval(myObj[2].innerHTML)-1;
100if(month==0)
101{
102month=12;
103subYear(obj);
104}
105myObj[2].innerHTML=month;
106dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
107}
108
109function addMonth(obj) //增加月份
110{
111var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes;
112var month=eval(myObj[2].innerHTML)+1;
113if(month==13)
114{
115month=1;
116addYear(obj);
117}
118myObj[2].innerHTML=month;
119dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML))
120}
121
122function dateShow(obj,year,month) //显示各月份的日
123{
124var myDate=new Date(year,month-1,1);
125var today=new Date();
126var day=myDate.getDay();
127var selectDate=obj.parentNode.parentNode.previousSibling.previousSibling.value.split(\'-\');
128var length;
129switch(month)
130{
131case 1:
132case 3:
133case 5:
134case 7:
135case 8:
136case 10:
137case 12:
138length=31;
139break;
140case 4:
141case 6:
142case 9:
143case 11:
144length=30;
145break;
146case 2:
147if((year%4==0)&&(year%100!=0)||(year%400==0))
148length=29;
149else
150length=28;
151}
152for(i=0;i<obj.cells.length;i++)
153{
154obj.cells[i].innerHTML=\'\';
155obj.cells[i].style.color=\'\';
156obj.cells[i].className=\'\';
157}
158for(i=0;i<length;i++)
159{
160obj.cells[i+day].innerHTML=(i+1);
161if(year==today.getFullYear()&&(month-1)==today.getMonth()&&(i+1)==today.getDate())
162obj.cells[i+day].style.color=\'red\';
163if(year==eval(selectDate[0])&month==eval(selectDate[1])&&(i+1)==eval(selectDate[2]))
164obj.cells[i+day].className=\'ds_border2\';
165}
166}
167
168function getValue(obj,inputObj) //把选择的日期传给输入框
169{
170var myObj=inputObj.nextSibling.nextSibling.childNodes[0].childNodes[0].cells[2].childNodes;
171if(obj.innerHTML)
172if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==1)
173inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-0"+obj.innerHTML;
174 else if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==2)
175inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-0"+obj.innerHTML;
176 else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==1)
177inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-"+obj.innerHTML;
178 else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==2)
179inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-"+obj.innerHTML;
180inputObj.nextSibling.nextSibling.style.display=\'none\';
181for(i=0;i<obj.parentNode.parentNode.parentNode.cells.length;i++)
182obj.parentNode.parentNode.parentNode.cells[i].className=\'\';
183obj.className=\'ds_border2\'
184}
185
186function dsMove(obj) //实现层的拖移
187{
188if(event.button==1)
189{
190var X=obj.clientLeft;
191var Y=obj.clientTop;
192obj.style.pixelLeft=X+(event.x-DS_x);
193obj.style.pixelTop=Y+(event.y-DS_y);
194}
195}
196</script>
197</head>
198
199<body>
200从
201<script language=javascript>
202var myDate=new dateSelector();
203myDate.year--;
204
205myDate.inputName=\'start_date\'; //注意这里设置输入框的name，同一页中日期输入框，不能出现重复的name。
206myDate.display();
207</script>
208到
209<script language=javascript>
210myDate.year++;
211myDate.inputName=\'end_date\'; //注意这里设置输入框的name，同一页中的日期输入框，不能出现重复的name。
212myDate.display();
213</script>
214
215</body>
216
217</html>
<html> 2
3
<head> 4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 5
<meta name="GENERATOR" content="Microsoft FrontPage 4.0"> 6
<meta name="ProgId" content="FrontPage.Editor.Document"> 7
<title>New Page 1</title> 8
<script language=javascript> 9
var DS_x,DS_y; 10
11
function dateSelector() //构造dateSelector对象，用来实现一个日历形式的日期输入框。 12
{ 
13
var myDate=new Date(); 14
15
this.year=myDate.getFullYear(); //定义year属性，年份，默认值为当前系统年份。 16
this.month=myDate.getMonth()+1; //定义month属性，月份，默认值为当前系统月份。 17
this.date=myDate.getDate(); //定义date属性，日，默认值为当前系统的日。 18
this.inputName=\'\'; //定义inputName属性，即输入框的name，默认值为空。注意：在同一页中出现多个日期输入框，不能有重复的name！ 19
this.display=display; //定义display方法，用来显示日期输入框。 20
} 21
22
function display() //定义dateSelector的display方法，它将实现一个日历形式的日期选择框。 23
{ 24
var week=new Array(\'日\',\'一\',\'二\',\'三\',\'四\',\'五\',\'六\'); 25
26
document.write("<style type=text/css>"); 27
document.write(" .ds_font td,span { font: normal 12px 宋体; color: #000000; }"); 28
document.write(" .ds_border { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }"); 29
document.write(" .ds_border2 { border: 1px solid #000000; cursor: hand; background-color: #DDDDDD }"); 30
document.write("</style>"); 31
32
var M=new String(this.month); 33
var d=new String(this.date); 34
35
if(M.length==1&d.length==1){ 
36
document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-0"+this.month+"-0"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");} 37
else if(M.length==1&d.length==2){ 38
document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-0"+this.month+"-"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");} 39
else if(M.length==2&d.length==1){ 40
document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-"+this.month+"-0"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");} 41
else if(M.length==2&d.length==2){ 42
document.write("<input style=\'text-align:center;\' id=\'DS_"+this.inputName+"\' name=\'"+this.inputName+"\' value=\'"+this.year+"-"+this.month+"-"+this.date+"\' title=双击可进行编缉 ondblclick=\'this.readOnly=false;this.focus()\' onblur=\'this.readOnly=true\' readonly>");} 43
44
document.write("<button style=\'width:60px;height:18px;font-size:12px;margin:1px;border:1px solid #A4B3C8;background-color:#DFE7EF;\' type=button onclick=this.nextSibling.style.display=\'block\' onfocus=this.blur()>选择日期</button>"); 45
46
document.write("<div style=\'position:absolute;display:none;text-align:center;width:0px;height:0px;overflow:visible\' onselectstart=\'return false;\'>"); 47
document.write(" <div style=\'position:absolute;left:-60px;top:20px;width:142px;height:165px;background-color:#F6F6F6;border:1px solid #245B7D;\' class=ds_font>"); 48
document.write(" <table cellpadding=0 cellspacing=1 width=140 height=20 bgcolor=#CEDAE7 onmousedown=\'DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();\' onmouseup=\'releaseCapture();\' onmousemove=\'dsMove(this.parentNode)\' style=\'cursor:move;\'>"); 49
document.write(" <tr align=center>"); 50
document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=subYear(this) title=\'减小年份\'><<</td>"); 51
document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=subMonth(this) title=\'减小月份\'><</td>"); 52
document.write(" <td width=52%><b>"+this.year+"</b><b>年</b><b>"+this.month+"</b><b>月</b></td>"); 53
document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=addMonth(this) title=\'增加月份\'>></td>"); 54
document.write(" <td width=12% onmouseover=this.className=\'ds_border\' onmouseout=this.className=\'\' onclick=addYear(this) title=\'增加年份\'>>></td>"); 55
document.write(" </tr>"); 56
document.write(" </table>"); 57
58
document.write(" <table cellpadding=0 cellspacing=0 width=140 height=20 onmousedown=\'DS_x=event.x-parentNode.style.pixelLeft;DS_y=event.y-parentNode.style.pixelTop;setCapture();\' onmouseup=\'releaseCapture();\' onmousemove=\'dsMove(this.parentNode)\' style=\'cursor:move;\'>"); 59
document.write(" <tr align=center>"); 60
for(i=0;i<7;i++) 61
document.write(" <td>"+week[i]+"</td>"); 62
document.write(" </tr>"); 63
document.write(" </table>"); 64
65
document.write(" <table cellpadding=0 cellspacing=2 width=140 bgcolor=#EEEEEE>"); 66
for(i=0;i<6;i++) 67
{ 68
document.write(" <tr align=center>"); 69
for(j=0;j<7;j++) 70
document.write(" <td width=10% height=16 onmouseover=if(this.innerText!=\'\'&&this.className!=\'ds_border2\')this.className=\'ds_border\' onmouseout=if(this.className!=\'ds_border2\')this.className=\'\' onclick=getValue(this,document.all(\'DS_"+this.inputName+"\'))></td>"); 71
document.write(" </tr>"); 72
} 73
document.write(" </table>"); 74
75
document.write(" <span style=cursor:hand onclick=this.parentNode.parentNode.style.display=\'none\'>【关闭】</span>"); 76
document.write(" </div>"); 77
document.write("</div>"); 78
79
dateShow(document.all("DS_"+this.inputName).nextSibling.nextSibling.childNodes[0].childNodes[2],this.year,this.month) 80
} 81
82
function subYear(obj) //减小年份 83
{ 84
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes; 85
myObj[0].innerHTML=eval(myObj[0].innerHTML)-1; 86
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML)) 87
} 88
89
function addYear(obj) //增加年份 90
{ 91
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes; 92
myObj[0].innerHTML=eval(myObj[0].innerHTML)+1; 93
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML)) 94
} 95
96
function subMonth(obj) //减小月份 97
{ 98
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes; 99
var month=eval(myObj[2].innerHTML)-1; 100
if(month==0) 101
{ 102
month=12; 103
subYear(obj); 104
} 105
myObj[2].innerHTML=month; 106
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML)) 107
} 108
109
function addMonth(obj) //增加月份 110
{ 111
var myObj=obj.parentNode.parentNode.parentNode.cells[2].childNodes; 112
var month=eval(myObj[2].innerHTML)+1; 113
if(month==13) 114
{ 115
month=1; 116
addYear(obj); 117
} 118
myObj[2].innerHTML=month; 119
dateShow(obj.parentNode.parentNode.parentNode.nextSibling.nextSibling,eval(myObj[0].innerHTML),eval(myObj[2].innerHTML)) 120
} 121
122
function dateShow(obj,year,month) //显示各月份的日 123
{ 124
var myDate=new Date(year,month-1,1); 125
var today=new Date(); 126
var day=myDate.getDay(); 127
var selectDate=obj.parentNode.parentNode.previousSibling.previousSibling.value.split(\'-\'); 128
var length; 129
switch(month) 130
{ 131
case 1: 132
case 3: 133
case 5: 134
case 7: 135
case 8: 136
case 10: 137
case 12: 138
length=31; 139
break; 140
case 4: 141
case 6: 142
case 9: 143
case 11: 144
length=30; 145
break; 146
case 2: 147
if((year%4==0)&&(year%100!=0)||(year%400==0)) 148
length=29; 149
else 150
length=28; 151
} 152
for(i=0;i<obj.cells.length;i++) 153
{ 154
obj.cells[i].innerHTML=\'\'; 155
obj.cells[i].style.color=\'\'; 156
obj.cells[i].className=\'\'; 157
} 158
for(i=0;i<length;i++) 159
{ 160
obj.cells[i+day].innerHTML=(i+1); 161
if(year==today.getFullYear()&&(month-1)==today.getMonth()&&(i+1)==today.getDate()) 162
obj.cells[i+day].style.color=\'red\'; 163
if(year==eval(selectDate[0])&month==eval(selectDate[1])&&(i+1)==eval(selectDate[2])) 164
obj.cells[i+day].className=\'ds_border2\'; 165
} 166
} 167
168
function getValue(obj,inputObj) //把选择的日期传给输入框 169
{ 170
var myObj=inputObj.nextSibling.nextSibling.childNodes[0].childNodes[0].cells[2].childNodes; 171
if(obj.innerHTML) 172
if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==1) 173
inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-0"+obj.innerHTML; 174
else if(obj.innerHTML.length==1&&myObj[2].innerHTML.length==2) 175
inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-0"+obj.innerHTML; 176
else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==1) 177
inputObj.value=myObj[0].innerHTML+"-0"+myObj[2].innerHTML+"-"+obj.innerHTML; 178
else if(obj.innerHTML.length==2&&myObj[2].innerHTML.length==2) 179
inputObj.value=myObj[0].innerHTML+"-"+myObj[2].innerHTML+"-"+obj.innerHTML; 180
inputObj.nextSibling.nextSibling.style.display=\'none\'; 181
for(i=0;i<obj.parentNode.parentNode.parentNode.cells.length;i++) 182
obj.parentNode.parentNode.parentNode.cells[i].className=\'\'; 183
obj.className=\'ds_border2\' 184
} 185
186
function dsMove(obj) //实现层的拖移 187
{ 188
if(event.button==1) 189
{ 190
var X=obj.clientLeft; 191
var Y=obj.clientTop; 192
obj.style.pixelLeft=X+(event.x-DS_x); 193
obj.style.pixelTop=Y+(event.y-DS_y); 194
} 195
} 196
</script> 197
</head> 198
199
<body> 200
从 201
<script language=javascript> 202
var myDate=new dateSelector(); 203
myDate.year--; 204
205
myDate.inputName=\'start_date\'; //注意这里设置输入框的name，同一页中日期输入框，不能出现重复的name。 206
myDate.display(); 207
</script> 208
到 209
<script language=javascript> 210
myDate.year++; 211
myDate.inputName=\'end_date\'; //注意这里设置输入框的name，同一页中的日期输入框，不能出现重复的name。 212
myDate.display(); 213
</script> 214
215
</body> 216
217
</html>