初學者JavaScript幫助（功能）

我在refdesk.com上從日曆複製腳本和HTML時遇到了一些麻煩。我需要將JavaScript放在不同的樣式表上，並使用這些函數在HTML頁面上重新創建日曆。這是我到目前爲止，任何提示都將有所幫助。這是一項家庭作業，所以我不在尋找答案。初學者JavaScript幫助（功能）

的JavaScript -

function initialize() 
{ 
    buildCal(); 
    updateCalender(); 
} 

var themonths = ['January','February','March','April','May','June', 
'July','August','September','October','November','December']; 

var todaydate = new Date(); 
var curmonth = todaydate.getMonth() + 1; //get current month (1-12) 
var curyear = todaydate.getFullYear(); //get current year 

function buildCal(month, year, cM, cH, cDW, cD, border) 
{ 
var mn = ['January','February','March','April','May','June','July','August','September','October','November','December']; 
var dim = [31,0,31,30,31,30,31,31,30,31,30,31]; 

var firstDaySelectedMonth = new Date(year, month - 1, 1); //DD replaced line to fix date bug when current day is 31st 
firstDaySelectedMonth.od=firstDaySelectedMonth.getDay() + 1; //DD replaced line to fix date bug when current day is 31st 

var todaydate = new Date(); //DD added 
var scanfortoday = (year == todaydate.getFullYear() && month == todaydate.getMonth() + 1) ? todaydate.getDate() : 0; //DD added 

dim[1] = (((firstDaySelectedMonth.getFullYear() % 100 != 0) && (firstDaySelectedMonth.getFullYear() %4 == 0)) || (firstDaySelectedMonth.getFullYear() % 400 == 0)) ? 29 : 28; 
var t = '<div class="' + cM + '"><table class="' + cM + '" cols="7" cellpadding="0" border="' + brdr + '" cellspacing="0"><tr align="center">'; 
t += '<td colspan="7" align="center" class="' + cH + '">' + mn[month - 1] + ' - ' + year + '</td></tr><tr align="center">'; 
for (s = 0; s < 7; s++) 
{ 
    t += '<td class="' + cDW + '">' + "SMTWTFS".substr(s,1) + '</td>'; 
    t += '</tr><tr align="center">'; 
} 

for(i = 1;i <= 42; i++) 
{ 
    var x = ((i-firstDaySelectedMonth.od >= 0) && (i-firstDaySelectedMonth.od < dim[month -1 ])) ? i-firstDaySelectedMonth.od + 1 : '&nbsp;'; 
     if (x == scanfortoday) //DD added 
     { 
      x = '<span id="today">' + x + '</span>'; //DD added 
      t += '<td class="' + cD + '">' + x +'</td>'; 
     } 
     if(((i) % 7 == 0) && (i < 36)) 
     { 
      t += '</tr><tr align="center">'; 
     } 
} 
return t += '</tr></table></div>'; 
} 
// update calender function 
function updateCalendar(theSelection) 
{ 
    var themonth = parseInt(theSelection[theSelection.selectedIndex].value) + 1; 
    var calendarstr = buildCal(themonth, curyear, "main", "month", "daysofweek", "days", 0); 

    if (document.getElementById) 
    { 
     document.getElementById("calendarspace").innerHTML = calendarstr; 
    } 
    document.write('<option value="'+(curmonth - 1) + '" selected="yes">Current Month</option>'); 
    for (i = 0; i < 12; i++) //display option for 12 months of the year 
    { 
    document.write('<option value="' + i + '">' + themonths[i] + ' ' + curyear + '</option>'); 
    } 
}

HTML -

 <!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <link rel="stylesheet" href="refdesk.css"> 
     <script src="refdesk.js"></script> 
    </head> 

    <body onload="initialize()"> 
    <!-- CALENDAR START --> 
     <form> 
      <div id="choicespace"> 
       <p>(This will be replaced with JavaScript-generated HTML)</p> 
       <select onchange="updatecalendar(this.options)"> 
       <script> 
       updatecalendar(theselection); 
       </script> 
       <option value="1" selected="yes">Current Month</option><option value="0">January 2013</option><option value="1">February 2013</option><option value="2">March 2013</option><option value="3">April 2013</option><option value="4">May 2013</option><option value="5">June 2013</option><option value="6">July 2013</option><option value="7">August 2013</option><option value="8">September 2013</option><option value="9">October 2013</option><option value="10">November 2013</option><option value="11">December 2013</option> 
       </select> 
      </div> 
      <div id="calendarspace"> 
       <p>(This will be replaced with JavaScript-generated HTML)</p> 
      </div> 
     </form> 
    </body> 
</html>

來源

2013-02-24 user2105189

什麼具體不工作？ – 2013-02-24 19:47:11

這是很多醜陋的代碼，是的。但是，你究竟在煩惱什麼？ – Bergi 2013-02-24 19:47:47

是的代碼是醜陋的，可能是我無法理解這一點的原因之一。我需要將日曆腳本放在一個單獨的js文件中，並使用它們來重新創建日曆。 – user2105189 2013-02-24 19:59:57

首先，揣摩你的JavaScript代碼到底是如何工作。作爲一個簡單的例子，請看calendar in javascript。

來源

2013-02-24 19:51:39 user1929959

我可以看到這是如何工作，但我無法重複使用它。 – user2105189 2013-02-24 20:00:16

@ user2105189看看語句做什麼。 – user1929959 2013-02-24 20:02:25

是的，更新日曆。 – user2105189 2013-02-24 20:08:53

就我個人而言，我會縮進更多以保持組織。我會做的另一件事就是做出更短的變量，因爲有時我發現自己的編碼錯誤，因爲我的巨大變量名稱。

來源

2014-02-26 01:15:10 user3353808

請不要將評論作爲答案。 – Popo 2014-02-26 01:35:26

初學者JavaScript幫助（功能）

回答

相關問題