初学者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帮助（功能）

回答

相关问题