<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<HTML>
<Head>
<Meta
HTTP-equiv = "Content-Type" content = "text/html; charset = gb2312">
<Meta
Name = "author" content = "Jiang Hongbin">
<Title> date selection-
Ziyue </title>
<Script language = "JavaScript"
Type = "text/JavaScript">
// Date Selection
// By ziyue (http://www.web-v.com/ )
VaR months = new array ("January ",
"August ", "December ");
VaR
Daysinmonth = new array (31, 28, 31, 30, 31, 30, 31, 31, 30, 31 );
VaR
Days = new array ("day", "one", "two", "three", "four", "five", "Six ");
VaR today;
Document. writeln ("<Div id = 'calendar 'style = 'position: absolute; Z-index: 1;
Visibility: hidden;
Filter:/"progid: DXImageTransform. Microsoft. Shadow (Direction = 135, color = #999999, strength = 3)/" '> </div> ");
Function
Getdays (month, year)
{
// The following code is used to determine whether the current time is a leap year.
If (1 = month)
Return (0 = year % 4) & (0! = (Year % 100) | (0 =
Year % 400 )? 29: 28;
Else
Return daysinmonth [month];
}
Function gettoday ()
{
// Get the year, month, and day of today
This. Now = new
Date ();
This. Year = this. Now. getfullyear ();
This. month =
This. Now. getmonth ();
This. Day = this. Now. getdate ();
}
Function
Getstringday (STR)
{
// Obtain the year, month, and day of the input box.
VaR
STR = Str. Split ("-")
This. Now = new
Date (parsefloat (STR [0]), parsefloat (STR [1])-1, parsefloat (STR [2]);
This. Year = this. Now. getfullyear ();
This. month =
This. Now. getmonth ();
This. Day = this. Now. getdate ();
}
Function
Newcalendar (){
VaR parseyear =
Parseint (document. All. year. Options [document. All. year. selectedindex]. value );
VaR newcal = new date (parseyear, document. All. Month. selectedindex, 1 );
VaR day =-1;
VaR startday = newcal. getday ();
VaR daily
= 0;
If (today. Year = newcal. getfullyear ())
& (Today. month = newcal. getmonth ()))
Day = today. Day;
VaR tablecal = Document. All. calendar;
VaR
Intdaysinmonth = getdays (newcal. getmonth (), newcal. getfullyear ());
For (VAR intweek = 1; intweek <tablecal. Rows. length; intweek ++)
For (VAR intday = 0; intday <
Tablecal. Rows [intweek]. cells. length; intday ++)
{
VaR
Cell = tablecal. Rows [intweek]. cells [intday];
If (intday =
Startday) & (0 = daily ))
Daily = 1;
If (Day = daily) // Today, call today's class
{
Cell. style. Background = '# 6699cc ';
Cell. style. Color = '# ffff ';
// Cell. style. fontweight = 'bold ';
}
Else
If (intday = 6) // Saturday
Cell. style. Color = 'green ';
Else if (intday = 0) // Sunday
Cell. style. Color = 'red ';
If
(Daily> 0) & (daily <= intdaysinmonth ))
{
Cell. innertext = daily;
Daily ++;
}
Else
Cell. innertext = "";
}
}
Function getdate (inputbox)
{
VaR sdate;
// This code handles mouse clicks
If (event. srcelement. tagname = "TD ")
If (event. srcelement. innertext! = "")
{
Sdate = Document. All. year. Value + "-" + document. All. Month. Value
+ "-" +
Event. srcelement. innertext;
Eval ("document. All." + inputbox). value = sdate;
Hiddencalendar ();
}
}
Function
Hiddencalendar ()
{
// Close the selection window
Document. All. Calendar. style. Visibility = 'den den ';
}
Function
Showcalendar (inputbox)
{
VaR X, Y, intloop, intweeks, intdays;
VaR
Divcontent;
VaR year, month, day;
VaR
O = eval ("document. All." + inputbox );
VaR Thisyear;
// The Year of the current year
Thisyear = new
Gettoday ();
Thisyear = Thisyear. Year;
Today =
O. value;
If (isdate (today ))
Today = new
Getstringday (today );
Else
Today = new gettoday ();
// Display position
X = O. offsetleft;
Y = O. offsettop;
While (O = O. offsetparent)
{
X + = O. offsetleft;
Y + = O. offsettop;
}
Document. All. Calendar. style. Left = x + 2;
Document. All. Calendar. style. Top = Y + 20;
Document. All. Calendar. style. Visibility = "visible ";
// Output the calendar table (border-color: #9dbaf7)
Divcontent = "<Table
Border = '0' cellspacing = '0' style = 'border: 1px solid # 0066ff;
Background-color: # edf2fc '> ";
Divcontent + = "<tr> ";
Divcontent + = "<TD
Style = 'border-bottom: 1px solid # 0066ff;
Background-color: # c7d8fa '> ";
// Year
Divcontent + = "<select
Name = 'Year' id = 'Year' onchange = 'newcalendar () 'style = 'font-family: verdana;
Font-size: 12px '> ";
For (intloop = Thisyear-35; intloop <
(Thisyear + 2); intloop ++)
Divcontent + = "<option value =" +
Intloop + "" + (today. Year = intloop? "Selected": "") + ">" + intloop +
"</Option> ";
Divcontent + = "</SELECT> ";
// Month
Divcontent + = "<select
Name = 'month' id = 'month' onchange = 'newcalendar () 'style = 'font-family: verdana;
Font-size: 12px '> ";
For (intloop = 0; intloop <months. length;
Intloop ++)
Divcontent + = "<option value =" + (intloop + 1) + "" +
(Today. month = intloop? "Selected": "") + ">" + months [intloop] +
"</Option> ";
Divcontent + = "</SELECT> ";
Divcontent + = "</TD> ";
Divcontent + = "<TD
Style = 'border-bottom: 1px solid # 0066ff; Background-color: # c7d8fa;
Font-weight: bold; font-family: wingdings 2, wingdings, webdings; font-size: 16px;
Padding-top: 2px; color: # 4477ff; cursor: Hand 'align = 'center' Title = 'close'
Onclick = 'javascript: hiddencalendar () '> S </TD> ";
Divcontent + = "</tr> ";
Divcontent + = "<tr> <TD align = 'center'
Colspan = '2'> ";
Divcontent + = "<Table id = 'calendar 'border = '0'
Width = '000000'> ";
// Week
Divcontent + = "<tr> ";
For
(Intloop = 0; intloop <days. length; intloop ++)
Divcontent + = "<TD align = 'center' style = 'font-size: 12px '>" +
Days [intloop] + "</TD> ";
Divcontent + = "</tr> ";
// Day
For (intweeks = 0;
Intweeks <6; intweeks ++)
{
Divcontent + = "<tr> ";
For (intdays = 0; intdays <days. length; intdays ++)
Divcontent + = "<TD onclick = 'getdate (/" "+ inputbox + "/")'
Style = 'cursor: hand; border-Right: 1px solid # bbbbbb; border-bottom: 1px solid
# Bbbbbb; color: #215dc6; font-family: verdana; font-size: 12px'
Align = 'center'> </TD> ";
Divcontent + = "</tr> ";
}
Divcontent + = "</table> </TD> </tr> </table> ";
Document. All. Calendar. innerhtml = divcontent;
Newcalendar ();
}
Function
Isdate (datestr)
{
VaR datepat =
/^ (/D {4}) (/-) (/d {1, 2}) (/-) (/d {1, 2}) $ /;
VaR matcharray =
Datestr. Match (datepat );
If (matcharray = NULL) return false;
VaR
Month = matcharray [3];
VaR day = matcharray [5];
VaR year =
Matcharray [1];
If (month <1 | month> 12) return false;
If (day <1 | day> 31) return false;
If (month = 4 |
Month = 6 | month = 9 | month = 11) & day = 31) return false;
If
(Month = 2)
{
VaR isleap = (Year % 4 = 0 & (Year %
100! = 0 | year % 400 = 0 ));
If (day> 29 | (Day = 29
&&! Isleap) return false;
}
Return
True;
}
</SCRIPT>
<Style
Type = "text/CSS">
<! --
TD, input {
Font-family: verdana, Arial,
Helvetica, sans-serif;
Font-size:
12px;
}
-->
</Style>
</Head>
<Body>
<Form
Name = "form1" method = "Post" Action = "">
<Table
Width = "500" border = "0" align = "center" cellspacing = "1"
Bgcolor = "# cccccc">
<Tr bgcolor = "# ffffff">
<TD
Align = "right"> your birthday: </TD>
<TD> <Input
Name = "Birthday" type = "text" id = "Birthday" Title = "click to select"
Onclick = "javascript: showcalendar (this. ID)" size = "20">
<Input type = "button" name = "Submit" value = "select"
Onclick = "javascript: showcalendar ('birthday')"> </TD>
<TD> blog: <
Href = "http://www.cd-wnt.com/http://www.cd-wnt.com/"> http://www.cd-wnt.com/</a> </TD>
</Tr>
</Table>
</Form>
</Body>
</Html>
