<!doctype   html   public   "-//w3c//dtd   html   4.0   transitional//en"> 
<html> 
<head> 
<title> Customizable   Calendar   Script </title> 
</head> <body> <style   type="text/css"> 
#YearCalendar{width:600px;border:1px   #E5E5E5   solid;} 
#YearCalendar   td.TestContainer{text-align:center;border:1px   #E5E5E5   solid;} /*   This   is   the   Default   Calendar   Theme*/ 
.tblCalendar{border:2px   #333   solid;border-collapse:collapse;font:normal   31px   Verdana,   Arial,   sans-serif;background:#E5E5E5;} 
.tblCalendar   td{border:1px   #333   solid;text-align:center;padding:2px;} 
.tblCalendar   td.SelectedDay{background:#999999;color:red;} 
.tblCalendar   td.Title{font-weight:bold;background:#000000;color:#C0C0C0;} 
.tblCalendar   .WeekName   td{font-weight:bold;} /*   These   are   some   customised   themes.   The   class   name   has   to   be   passed   to   the   function   as   the   4th   argument*/ 
.CalendarStyle{border:2px   #333   solid;border-collapse:collapse;font:normal   31px   Verdana,   Arial,   sans-serif;background:#A8DCB7;} 
.CalendarStyle   td{border:1px   #333   solid;text-align:center;padding:2px;} 
.CalendarStyle   td.SelectedDay{background:#999999;color:red;} 
.CalendarStyle   td.Title{font-weight:bold;background:#378D44;color:#C0C0C0;} 
.CalendarStyle   .WeekName   td{font-weight:bold;} 
</style> <script> 
year =   2008; 
month =   2; 
day =   25; document.write(' <tr> '); 
document.write(' <td   class="TestContainer"> '); 
        id   =   Calendar(year,   month,   day,   null,   'CalendarStyle'   ); document.write(' <input   type="button"   onclick="ShowHide(this,\''+id+'\');"   value="Hide"> </td> '); 
document.write(" </tr> "); function   ShowHide(btn,   id) 

StyleObj   =   document.getElementById(id).style; 
if   (StyleObj.display   !=   'none') 

StyleObj.display   =   'none'; 
btn.value   =   'Show'; 

else 

StyleObj.display   =   'block'; 
btn.value   =   'Hide'; 

} function   Calendar(Year,   Month,   Day,   ContainerId,   ClassName) 

Calendar.MonthNames   =   new   Array('January',   'February',   'March',   'April',   'May',   'June',   'July',   'August',   'September',   'October',   'November',   'December'); //If   no   parameter   is   passed   use   the   current   date. 
this.oDate =   new   Date(); 
this.Year =   (Year   ==   null)   ?   this.oDate.getFullYear()   :   Year; 
this.Month =   (Month   ==   null)   ?   this.oDate.getMonth()   :   Month   -   1; 
this.Day =   (Day   ==   null)   ?   0   :   Day; 
this.oDate =   new   Date(this.Year,   this.Month,   1); 
this.NextMonth =   new   Date(this.Year,   this.Month   +   1,   1); 
this.WeekStart =   this.oDate.getDay(); //   Get   the   number   of   months   in   current   month 
this.MonthDays =   Math.round((this.NextMonth.getTime()   -   this.oDate.getTime())   /   86400000)   +   1;       
this.HTML =   ' <table  id="mytable" class="'   +   ((ClassName   ==   null)   ?   'tblCalendar'   :   ClassName)   +   '"   cellspacing="0"> '; //   Title   bar 
this.HTML   +=   ' <tr> <td   colspan="7"   class="Title"> '   +   Calendar.MonthNames[this.Month]   +   '   '   +   this.Year   +   ' </td> </tr> '; //   Week   Names 
this.HTML   +=   ' <tr   class="WeekName"> <td> S </td> <td> M </td> <td> T </td> <td> W </td> <td> T </td> <td> F </td> <td> S </td> </tr> '; 
this.HTML   +=   ' <tr> '; //   Fill   the   previous   month   days   with   space 
for(DayCounter   =   0;   DayCounter   <   this.WeekStart;   DayCounter++) 

this.HTML   +=   ' <td> &nbsp; </td> '; 
} //   Populate   current   month 
for(DayCounter   =   1;   DayCounter   <   this.MonthDays;   DayCounter++) 

if((DayCounter   +   this.WeekStart)   %   7   ==   1)   this.HTML   +=   ' <tr> '; if(DayCounter   ==   this.Day) 
this.HTML   +=   ' <td   class="SelectedDay"> '   +   DayCounter   +   ' </td> '; 
else   this.HTML   +=   ' <td> '   +   DayCounter   +   ' </td> '; if((DayCounter   +   this.WeekStart)   %   7   ==   0)   this.HTML   +=   ' </tr> '; 
} //   Fill   the   next   month   days   with   space 
for(j   =   (42   -   (this.MonthDays   +   this.WeekStart)),   DayCounter   =   0;   DayCounter   <=   j;   DayCounter++) 

this.HTML   +=   ' <td> &nbsp; </td> '; 
if((j   -   DayCounter)   %   7   ==   0)   this.HTML   +=   ' </tr> '; 
} this.HTML   +=   ' </table> '; //   Check   whether   the   Container   Id   is   null 
if(ContainerId   !=   null) 

this.Container   =   document.getElementById(ContainerId); if(this.Container) //   If   an   object   exists   with   the   given   ContainerId   insert   the   Calendar   into   the   object 
document.getElementById(ContainerId).innerHTML   =   this.HTML; 
else //   Else   create   an   element   with   the   given   id   and   insert   the   calendar 
document.write(' <div   id="'   +   ContainerId   +   '"> '   +   this.HTML   +   ' </div> '); 

else 

//   Loop   until   a   unique   id   is   obtained   for   the   container 
do 

ContainerId   =   'tblCalendar'   +   Math.round(Math.random()   *   1000); 

while(document.getElementById(ContainerId)); //   create   an   element   with   the   new   id   and   insert   the   calendar 
document.write('   <div   id="'   +   ContainerId   +   '"   style="display:none">   '   +   this.HTML   +   '   </div>   ');   
    //document.write(' <div   id="'   +   ContainerId   +   '"> '   +   this.HTML   +   ' </div> '); } //   Returns   Id   of   the   element   containing   the   calendar 
return   ContainerId; 

/////////////////////////////////////////////
/////////////////////////////////////////////
for(var i = 1; i < 50; i++)
{
document.getElementById('mytable').getElementsByTagName('td')[i].onclick = test;
}
function test()
{
if(this.innerHTML.match(/\d/))
{
alert(this.innerHTML);
}
}
</script> </body> 
</html> -。-