日期选择控件

//选择时间by zwb
function SelDateById(ControlId)
{
ArgDate=document.getElementById(ControlId).value;
ReturnValue=window.showModalDialog("../SelDate.htm",ArgDate,
"dialogWidth:336px;dialogHeight:280px;Resizable:0;help=no;status:No;center:yes;" );
if (ReturnValue!=undefined)
    {
      document.getElementById(ControlId).value=ReturnValue;
   return false;
}
else
    {
      return false;
}
}

//SelDate.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
2

<HTML>
3

<HEAD>
5

<title>选择日期</title>
6

var toDay=new Date();
9

var toDayYear=toDay.getFullYear();
10

var toDayMonth=toDay.getMonth();
11

var toDayDate=toDay.getDate();
12

var selectedDate;
13

function FormOnLoad()
14

{
15

var year;
16

var month;
17

var day
18

var myDate=new Date();
19

try{
20

if (window.dialogArguments!=undefined && window.dialogArguments!="")
21

{
22

var ArgStr=window.dialogArguments;
23

var DateArry=ArgStr.split(".");
24

if(DateArry.length==3){
25

DateArry=ArgStr.split("-");
26

myDate=new Date(DateArry[0],DateArry[1]-1,DateArry[2]);
27

}
28

}
29

}catch(e){}
30

month=myDate.getMonth();
31

document.frmDate.year.value=myDate.getFullYear();
32

document.frmDate.month.selectedIndex=month;
33

selectedDate=myDate.getDate();
34

setDayTab(myDate.getFullYear(),month);
35

}
36

function setDayTab(year,month){
37

var xxDate=new Date(year,month,1)
38

var days=31;
39

var d2
40

var wd=xxDate.getDay();
41

if(month<11){
42

d2=new Date(year,month+1,1);
43

days=(d2-xxDate)/(24*60*60*1000);
44

}
45

predays=31;
46

if(month>0){
47

d2=new Date(year,month-1,1);
48

predays=(xxDate-d2)/(24*60*60*1000);
49

}
50

for(i=0;i<wd;i++){
51

xx=predays-wd+i+1;
52

document.all["DL1"+i].innerHTML=xx;
53

document.all["DL1"+i].className="toDisDay";
54

}
55

var j;
56

var x=1;
57

for(j=1;j<=days;){
58

for(;wd<7 && j<=days;wd++,j++){
59

document.all["DL"+x+""+wd].innerHTML=j;
60

if(year==toDayYear && month==toDayMonth && j==toDayDate){
61

if(selectedDate==j){
62

document.all["DL"+x+""+wd].className="toDaySelectedDay";
63

}else{
64

document.all["DL"+x+""+wd].className="toDay";
65

}
66

}else if(selectedDate==j){
67

document.all["DL"+x+""+wd].className="toSeletedDay";
68

}else{
69

document.all["DL"+x+""+wd].className="generDay";
70

}
71

document.all["DL"+x+""+wd].style.cursor="hand";
72

document.all["DL"+x+""+wd].dayValue=j;
73

document.all["DL"+x+""+wd].title="双击选择"+year+"年"+document.frmDate.month[month].text+j+"日";
74

document.all["DL"+x+""+wd].onclick=clickToSelected;
75

document.all["DL"+x+""+wd].ondblclick=BtnOKOnClick;
76

}
77

if(j<=days){
78

wd=0;
79

x++;
80

}
81

}
82

j=1;
83

for(;x<7;x++){
84

for(;wd<7;wd++,j++){
85

document.all["DL"+x+""+wd].innerHTML=j;
86

document.all["DL"+x+""+wd].className="toDisDay";
87

}
88

wd=0;
89

}
90

}
91

function clickToSelected(){
92

if(event.srcElement.dayValue!=null){
93

selectedDate=event.srcElement.dayValue;
94

setDayTab(document.frmDate.year.value,document.frmDate.month.selectedIndex);
95

}
96

}
97

function onMonthchange(){
98

setDayTab(document.frmDate.year.value,document.frmDate.month.selectedIndex);
99

}
100

function btnOk(){
101

window.returnValue=document.frmDate.year.value+"-"+(document.frmDate.month.selectedIndex+1)+"-"+selectedDate;
102

window.close();
103

}
104

function BtnOKOnClick()
105

{
106

if(event.srcElement.dayValue!=null){
107

window.returnValue=document.frmDate.year.value+"-"+(document.frmDate.month.selectedIndex+1)+"-"+event.srcElement.dayValue;
108

window.close();
109

}
110

}
111

</script>
112

<!--
114

TD {
115

font-size: 9pt;
116

}
117

th {
118

font-size: 9pt;
119

}
120

option {
121

color: #006699;
122

border: 1px solid #003366;
123

}
124

select {
125

font-size: 9pt;
126

border: 1px solid #990000;
127

}
128

.toHead {
129

color: #FFFFFF;
130

background-color: #003366;
131

}
132

.toSeletedDay {
133

color: #FFFFFF;
134

background-color: #003399;
135

}
136

.toDisDay {
137

color: #999999;
138

}
139

.toDay {
140

border: 1px solid #990000;
141

}
142

.toDaySelectedDay {
143

border: 1px solid #990000;
144

color: #FFFFFF;
145

background-color: #003399;
146

}
147

-->
148

</style>
149

</HEAD>
150

<BODY bgcolor="#CCCCCC" leftMargin="0" topMargin="0" rightMargin="0" bottomMargin="0" marginwidth="0" marginheight="0" onload="FormOnLoad()">
151

<form name="frmDate" onSubmit="return false;">
152

<div align="center">
153

<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
154

<tr>
155

<td align="center">
156

<table border="1" cellpadding="0" cellspacing="0" bgcolor="#CCCCCC" bordercolorlight="#000000" bordercolordark="#ffffff" width=90%>
157

<tr>
158

<td><table border="0" cellpadding="4" cellspacing="1" width=100%>
159

<tr>
160

<th colspan="7"> <table border="0" cellspacing="0" cellpadding="0">
161

<tr>
162

<td><input name="year" type="text" id="year" size="6" maxlength="4" onBlur="onMonthchange()">
163

</td>
164

<td align="right"> <select name="month" onchange="onMonthchange()">
165

<option value="1">一月</option>
166

<option value="2">二月</option>
167

<option value="3">三月</option>
168

<option value="4">四月</option>
169

<option value="5">五月</option>
170

<option value="6">六月</option>
171

<option value="7">七月</option>
172

<option value="8">八月</option>
173

<option value="9">九月</option>
174

<option value="10">十月</option>
175

<option value="11">十一月</option>
176

<option value="12">十二月</option>
177

</select> </td>
178

</tr>
179

</table></th>
180

</tr>
181

<tr>
182

<th class="toHead">日</th>
183

<th class="toHead">一</th>
184

<th class="toHead">二</th>
185

<th class="toHead">三</th>
186

<th class="toHead">四</th>
187

<th class="toHead">五</th>
188

<th class="toHead">六</th>
189

</tr>
190

<tr>
191

<td align="center" id="DL10"> </td>
192

<td align="center" id="DL11"> </td>
193

<td align="center" id="DL12"> </td>
194

<td align="center" id="DL13"> </td>
195

<td align="center" id="DL14"> </td>
196

<td align="center" id="DL15"> </td>
197

<td align="center" id="DL16"> </td>
198

</tr>
199

<tr>
200

<td align="center" id="DL20"> </td>
201

<td align="center" id="DL21"> </td>
202

<td align="center" id="DL22"> </td>
203

<td align="center" id="DL23"> </td>
204

<td align="center" id="DL24"> </td>
205

<td align="center" id="DL25"> </td>
206

<td align="center" id="DL26"> </td>
207

</tr>
208

<tr>
209

<td align="center" id="DL30"> </td>
210

<td align="center" id="DL31"> </td>
211

<td align="center" id="DL32"> </td>
212

<td align="center" id="DL33"> </td>
213

<td align="center" id="DL34"> </td>
214

<td align="center" id="DL35"> </td>
215

<td align="center" id="DL36"> </td>
216

</tr>
217

<tr>
218

<td align="center" id="DL40"> </td>
219

<td align="center" id="DL41"> </td>
220

<td align="center" id="DL42"> </td>
221

<td align="center" id="DL43"> </td>
222

<td align="center" id="DL44"> </td>
223

<td align="center" id="DL45"> </td>
224

<td align="center" id="DL46"> </td>
225

</tr>
226

<tr>
227

<td align="center" id="DL50"> </td>
228

<td align="center" id="DL51"> </td>
229

<td align="center" id="DL52"> </td>
230

<td align="center" id="DL53"> </td>
231

<td align="center" id="DL54"> </td>
232

<td align="center" id="DL55"> </td>
233

<td align="center" id="DL56"> </td>
234

</tr>
235

<tr>
236

<td align="center" id="DL60"> </td>
237

<td align="center" id="DL61"> </td>
238

<td align="center" id="DL62"> </td>
239

<td align="center" id="DL63"> </td>
240

<td align="center" id="DL64"> </td>
241

<td align="center" id="DL65"> </td>
242

<td align="center" id="DL66"> </td>
243

</tr>
244

</table></td>
245

</tr>
246

</table>
247

<table border="0" cellspacing="0" cellpadding="0">
248

<tr>
249

<td width="80">
250

<input name="按钮" type="button" value="确定" onclick="btnOk()">
251

</td>
252

<td><input type="button" value="取消" onclick="window.close();"></td>
253

</tr>
254

</table></td>
255

</tr>
256

</table>
257

</div>
258

</form>
259

</BODY>
260

</HTML>

posted on 2006-03-27 17:39 wen 阅读(127) 评论(0) 收藏举报

刷新页面返回顶部

文

日期选择控件

导航

公告