自己創建日曆

- 中國WEB開發者網絡 (http://www.webasp.net)
-- 網頁特效 (http://www.webasp.net/javascript/)
--- 自己創建日曆 (http://www.webasp.net/javascript/1/63.htm)
-- 發佈日期： 2004-05-26
<!-- 網頁特效代碼由[中國WEB開發者網絡:http://www.ChinaWebDev.com]提供！ -->
<!-- 要實現此效果需要 3 個步驟： -->

<!-- 第 1 步： -->
<!-- 把下面的代碼加到<HEAD></HEAD>區域中： -->

<SCRIPT LANGUAGE="JavaScript">
<!--



function displayCalendar(init) {

var i;

var now = new Date();

var nowYear = now.getYear() - 95;

var nowMonth = now.getMonth();

var nowDay = now.getDate();



// on open of document

if (init==1) {

document.calControl.month.selectedIndex = nowMonth;

document.calControl.year.selectedIndex = nowYear;

}

var month=document.calControl.month.selectedIndex

var year=document.calControl.year.selectedIndex+1995



var days=getDaysInMonth(month+1,year);



var firstOfMonth = new Date (year, month, 1);



var startingPos=firstOfMonth.getDay()+7;



days+=startingPos;



// label days of week

i=0;

document.calButtons.elements[i++].value = " S ";

document.calButtons.elements[i++].value = " M ";

document.calButtons.elements[i++].value = " T ";

document.calButtons.elements[i++].value = " W ";

document.calButtons.elements[i++].value = " T ";

document.calButtons.elements[i++].value = " F ";

document.calButtons.elements[i++].value = " S ";



// blank out non date buttons

for (i=7; i<startingPos; i++)

document.calButtons.elements[i].value = " ";



for (i=startingPos; i<days; i++)

document.calButtons.elements[i].value = i-startingPos+1;



// show focus on today if the calendar is the proper month and year

if (month==nowMonth && year==nowYear+1995)

document.calButtons.elements[nowDay+startingPos-1].focus();





// blank out rest of non date buttons

for (i=days; i<49; i++)

document.calButtons.elements[i].value = " ";

}



function leapYear (Year) {

if (((Year % 4)==0) && ((Year % 100)!=0) || ((Year % 400)==0))

return (1);

else

return (0);

}



function getDaysInMonth(month,year) {

var days;

if (month==1 || month==3 || month==5 || month==7 || month==8 ||

month==10 || month==12) days=31;

else if (month==4 || month==6 || month==9 || month==11) days=30;

else if (month==2) {

if (leapYear (year)==1) days=29;

else days=28;

}

return (days);

}

// -->



</SCRIPT>




<!-- 第 2 步： -->
<!-- 把<BODY>中的屬性代碼改為： -->

<BODY bgcolor="#fef4d9" ONLOAD="displayCalendar(1)">



<!-- 第 3 步： -->
<!-- 把下面的代碼加到<BODY></BODY>區域中： -->

<FORM NAME="calControl">month <SELECT NAME="month"><OPTION>Jan <OPTION>Feb <OPTION>Mar <OPTION>Apr <OPTION>May <OPTION>Jun <OPTION>Jul <OPTION>Aug <OPTION>Sep <OPTION>Oct <OPTION>Nov <OPTION>Dec </SELECT>

year <SELECT NAME="year"><OPTION>1995 <OPTION>1996 <OPTION>1997 <OPTION>1998 <OPTION>1999 <OPTION>2000 </SELECT><INPUT TYPE="button" NAME="button1" VALUE="Create"

onClick="displayCalendar(0)"></FORM><FORM NAME="calButtons"><INPUT TYPE="button" NAME="but0" value=" "><INPUT TYPE="button" NAME="but1" value=" "><INPUT TYPE="button" NAME="but2" value=" "><INPUT TYPE="button" NAME="but3" value=" "><INPUT TYPE="button" NAME="but4" value=" "><INPUT TYPE="button" NAME="but5" value=" "><INPUT TYPE="button" NAME="but6" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but7" value=" "><INPUT TYPE="button" NAME="but8" value=" "><INPUT TYPE="button" NAME="but9" value=" "><INPUT TYPE="button" NAME="but10" value=" "><INPUT TYPE="button" NAME="but11" value=" "><INPUT TYPE="button" NAME="but12" value=" "><INPUT TYPE="button" NAME="but13" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but14" value=" "><INPUT TYPE="button" NAME="but15" value=" "><INPUT TYPE="button" NAME="but16" value=" "><INPUT TYPE="button" NAME="but17" value=" "><INPUT TYPE="button" NAME="but18" value=" "><INPUT TYPE="button" NAME="but19" value=" "><INPUT TYPE="button" NAME="but20" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but21" value=" "><INPUT TYPE="button" NAME="but22" value=" "><INPUT TYPE="button" NAME="but23" value=" "><INPUT TYPE="button" NAME="but24" value=" "><INPUT TYPE="button" NAME="but25" value=" "><INPUT TYPE="button" NAME="but26" value=" "><INPUT TYPE="button" NAME="but27" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but28" value=" "><INPUT TYPE="button" NAME="but29" value=" "><INPUT TYPE="button" NAME="but30" value=" "><INPUT TYPE="button" NAME="but31" value=" "><INPUT TYPE="button" NAME="but32" value=" "><INPUT TYPE="button" NAME="but33" value=" "><INPUT TYPE="button" NAME="but34" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but35" value=" "><INPUT TYPE="button" NAME="but36" value=" "><INPUT TYPE="button" NAME="but37" value=" "><INPUT TYPE="button" NAME="but38" value=" "><INPUT TYPE="button" NAME="but39" value=" "><INPUT TYPE="button" NAME="but40" value=" "><INPUT TYPE="button" NAME="but41" value=" "></CENTER>



<CENTER><INPUT TYPE="button" NAME="but42" value=" "><INPUT TYPE="button" NAME="but43" value=" "><INPUT TYPE="button" NAME="but44" value=" "><INPUT TYPE="button" NAME="but45" value=" "><INPUT TYPE="button" NAME="but46" value=" "><INPUT TYPE="button" NAME="but47" value=" "><INPUT TYPE="button" NAME="but48" value=" "></CENTER>



<CENTER></FORM>

webasp.net