頁:
[1]
能否請程式高手幫忙註解JavaScript 萬年曆裡面每一段程式碼的解釋
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<meta http-equiv="Content-Language" content="zh-tw">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>萬年曆</title>
<link rel="stylesheet" href="ftie4style.css">
<!--<base target="_self">-->
</head>
<script language="JavaScript">
var Selected_Month;
var Selected_Year;
var Current_Date = new Date(); //取得今天的日期
var Current_Month = Current_Date.getMonth(); //設定當月
var Days_in_Month = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
//每月日期初始值設定
var Month_Label = new Array('1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月');//下拉選單的內容
var Current_Year = Current_Date.getYear();
var Today = Current_Date.getDate();
function Header(Year, Month) {
if (Month == 1) {
if (Year % 4 == 0) {
// if ((Year % 400 == 0) || ((Year % 4 == 0) && (Year % 100 != 0))) {
Days_in_Month = 29;//四年一潤
}
else{
Days_in_Month = 28;
}
}
var Header_String = Year + '年 ' + Month_Label; //組 顯示在萬年曆上方之年月字串
return Header_String; //回傳 "xxxx年 x月"
}
function Make_Calendar(Year, Month) {
/*var mMonth;
if (Month=='1'){mMonth='Jan'; }
if (Month=='2'){mMonth='Feb'; }
if (Month=='3'){mMonth='Mar'; }
if (Month=='4'){mMonth='Apr'; }
if (Month=='5'){mMonth='May'; }
if (Month=='6'){mMonth='Jun'; }
if (Month=='7'){mMonth='Jul'; }
if (Month=='8'){mMonth='Aug'; }
if (Month=='9'){mMonth='Sep'; }
if (Month=='10'){mMonth='Oct'; }
if (Month=='11'){mMonth='Nov'; }
if (Month=='12'){mMonth='Dec'; }*/
var First_Date = new Date( Year, Month, 1 );
//var First_Date = new Date(mMonth+'1,'+Year);
//var First_Date = new Date(Year+"/"+Month+"/1" );
//date的用法不是應該是 ex：Date("Jun 1, 2007");
var Heading = Header(Year, Month);
var First_Day = First_Date.getDay() +1;
if (((Days_in_Month == 31) && (First_Day >= 6)) ||
((Days_in_Month == 30) && (First_Day == 7))) {
var Rows = 6;
}
else if ((Days_in_Month == 28) && (First_Day == 1)) {
var Rows = 6;
}
else {
var Rows = 6;
}
var HTML_String = '<table ><tr><td valign="top"><table BORDER=0 CELLSPACING=1 cellpadding=4 FRAME="box" >';
HTML_String += '<tr><td colspan=7 BORDERCOLOR="000000" style="width:260px;height:12px;margin:0;padding:0;border:0px solid red;" align="center">' + Heading + '</td></tr>';
HTML_String += '<tr class="calender"><td ALIGN="CENTER" BGCOLOR="FFFFFF" style="color:#FF0000;" height="10">Sun</td>';
HTML_String += '<td ALIGN="CENTER" BGCOLOR="FFFFFF" >Mon</td>';
HTML_String += '<td ALIGN="CENTER" BGCOLOR="FFFFFF" >Tue</td>';
HTML_String += '<td ALIGN="CENTER" BGCOLOR="FFFFFF" >Wed</td>';
HTML_String += '<td ALIGN="CENTER" BGCOLOR="FFFFFF" >Thu</td><td ALIGN="CENTER" BGCOLOR="FFFFFF" BORDERCOLOR="000000" >Fri</td><td ALIGN="CENTER" BGCOLOR="FFFFFF" style="color:#008000;">Sat</td></tr>';
var Day_Counter = 1;
var Loop_Counter = 1;
for (var j = 1; j <= Rows; j++) {
HTML_String += '<tr ALIGN="center" VALIGN="top" class="size">';
for (var i = 1; i < 8; i++) {
if ((Loop_Counter >= First_Day) && (Day_Counter <= Days_in_Month)) {
if (i==1){
HTML_String += '<td BORDERCOLOR="000000" style="color:#FF0000;">'+ Day_Counter + '</td>';
}
else if(i==7){
HTML_String += '<td BORDERCOLOR="000000" style="color:#008000;padding-left:3px;">'+ Day_Counter + '</td>';
}
else{
HTML_String += '<td BORDERCOLOR="000000" >'+ Day_Counter + '</td>';
}
/*if ((Day_Counter == Today) && (Year == Current_Year) && (Month == Current_Month)) {
HTML_String += '<td BGCOLOR="808000" BORDERCOLOR="000000" ><strong><font color="red">' + Day_Counter + '</font></strong></td>';
}
else {
// HTML_String += '<td BORDERCOLOR="000000" >'+ Day_Counter + '</td>';
}*/
Day_Counter++;
}
else {
HTML_String += '<td class="empty" >'+' </td>';
}
Loop_Counter++;
}
HTML_String += '</tr>';
}
HTML_String += '</table></td></tr></table>';
document.all.Calendar.innerHTML = HTML_String;
}
function Check_Nums() {
if ((event.keyCode < 48) || (event.keyCode > 57)) {
return false;
}
}
function On_Year() { //輸入西元年時
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
}
function On_Month() {
var Year = document.when.year.value;
if (Year.length == 4) {
Selected_Month = document.when.month.selectedIndex;
Selected_Year = Year;
Make_Calendar(Selected_Year, Selected_Month);
}
else {
alert('Please enter a valid year.');
document.when.year.focus();
}
}
function Defaults() {
if (!document.all)
return
var Mid_Screen = Math.round(document.body.clientWidth / 2);
document.when.month.selectedIndex = Current_Month;
document.when.year.value = Current_Year;
Selected_Month = Current_Month;
Selected_Year = Current_Year;
Make_Calendar(Current_Year, Current_Month);
}
function Skip(Direction) {
if (Direction == '+') {//下個月
if (Selected_Month == 11) {
Selected_Month = 0;
Selected_Year++;
}
else {
Selected_Month++;
}
}
else {//上個月
if (Selected_Month == 0) {
Selected_Month = 11;
Selected_Year--;
}
else {
Selected_Month--;
}
}
Make_Calendar(Selected_Year, Selected_Month);
document.when.month.selectedIndex = Selected_Month;
document.when.year.value = Selected_Year;
}
</script>
<body>
<div id="NavBar" style="position:relative;width:286px;left:110; top:5px;" align="center">
<form name="when">
<p> </p>
<p> </p>
<p>請輸入西元年如：2000</p>
<table>
<tr>
<td>
<p align="center"><input type="button" value="上個月"></p>
</td>
<td></td>
<td><input type="text" name="year" size="4" maxlength="4" value=""></td>
<td><select name="month">
<script language="JavaScript1.2">
if (document.getElementsByName('input')!=""){
//if (document.all){// => 判斷有無表單任何欄位
for (var j=0;j<Month_Label.length;j++) {
document.writeln('<option value=' + j + '>' + Month_Label);
}
}
</script>
</select></td>
<td></td>
<td><input type="button" value="下個月"></td>
</tr>
</table>
</form>
</div>
<div id="Calendar" style="position:relative;width:298px;height:168px;left:110; top:-2px;border:1px solid black;" align="center">
</div>
<center>
</html>
...<div class='locked'><em>瀏覽完整內容，請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div><div></div> 妳何不考慮用JQUERY套件完成以上功能呢...^^~
頁:
[1]