2017-02-15 57 views
2

我正在试图创建打印今天的日期创建在JavaScript/HTML日历

但是日历,我的日历仍然是空白

与当我尝试打印日历整个日历

因为我不是通过HTML打印表格,而是试图通过javascript打印表格。

var $ = function (id) { return document.getElementById(id); }; 
 

 

 
var getMonthText = function(currentMonth) { 
 
    if (currentMonth === 0) { return "January"; } 
 
    else if (currentMonth === 1) { return "February"; } 
 
    else if (currentMonth === 2) { return "March"; } 
 
    else if (currentMonth === 3) { return "April"; } 
 
    else if (currentMonth === 4) { return "May"; } 
 
    else if (currentMonth === 5) { return "June"; } 
 
    else if (currentMonth === 6) { return "July"; } 
 
    else if (currentMonth === 7) { return "August"; } 
 
    else if (currentMonth === 8) { return "September"; } 
 
    else if (currentMonth === 9) { return "October"; } 
 
    else if (currentMonth === 10) { return "November"; } 
 
    else if (currentMonth === 11) { return "December"; } 
 
}; 
 

 
var getLastDayofMonth = function(currentMonth) { 
 
    var dt = new Date(); 
 
    dt.setMonth(currentMonth +1); 
 
    dt.setDate(0); 
 
    
 
    return dt.getDate(); 
 
    
 
}; 
 

 
window.onload = function() { 
 
    
 
    //var year = 
 
    
 
};
body { 
 
    font-family: Arial, Helvetica, sans-serif; 
 
    background-color: white; 
 
    margin: 0 auto; 
 
    width: 360px; 
 
    border: 3px solid blue; 
 
    padding: 0 2em 1em; 
 
} 
 
h1 { 
 
    color: blue; 
 
    margin-bottom: .25em; 
 
} 
 
table { 
 
    border-collapse: collapse; 
 
    border: 1px solid black; 
 
} 
 
td { 
 
    width: 3em; 
 
    height: 3em; 
 
    vertical-align: top; 
 
    padding: 0.5 0 0 0.5; 
 
    border: 1px solid black; 
 
}
<title>Calendar</title> 
 
    <link rel="stylesheet" href="calendar.css"> 
 
    <script src="calendar.js"></script> 
 

 
<body> 
 
    <main> 
 
     <h1><span id="month_year">&nbsp;</span></h1> 
 

 
     <table id="calendar"> 
 
      <tr><th>Sun</th><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th></tr> 
 
      
 
      
 
     </table> 
 
    </main> 
 
</body>

+0

发布提问与问题 –

+0

https://jsfiddle.net/wtb1s7bf/ – steven

+0

不要打扰一个小提琴,代码在这里运行。 – RobG

回答

1

你需要赚更多的开始的日历部分,但这里的一些帮助,你有什么。

getMonthText功能将得到更好的命名getMonthName并且可以很简单的:

/* Return month name 
 
** @param {number|string} index - integer month number, zero indexed 
 
** @returns {string} Full month name or undefined if index < 0 or > 11. 
 
*/ 
 
function getMonthName(index) { 
 
    return ['January','February','March','April','May','June','July', 
 
      'August','September','October','November','December'][index]; 
 
} 
 

 
var index = new Date().getMonth(); 
 

 
console.log(getMonthName(index));

getLastDayofMonth功能应该日期设定为第一的月(或29日之前的任何日期),然后再加上一个月,因为在1月31日之后增加1个月将返回3月2日或3日,因此您将获得F的最后一天月‧日(同样地,对于任何一个月之后的天数较少一个月),所以:

/* Return a date for the last day of the month of the provided date 
 
** @param {Date} date - date to get last day of month for 
 
** @returns {Date} date for last day of month 
 
*/ 
 
function getLastDayOfMonth(date) { 
 
    // Copy date so don't modify original, default to today 
 
    var d = date? new Date(date) : new Date(); 
 
    // Set to start of month 
 
    d.setDate(1); 
 
    // Add a month and set to last day of previous 
 
    // i.e. set to last day of current month 
 
    d.setMonth(d.getMonth() + 1, 0); 
 
    return d; 
 
} 
 

 
console.log(getLastDayOfMonth().toString()); 
 
console.log(getLastDayOfMonth(new Date(2016,1)).toString());

丢失的功能身体的其余部分需要创造细胞的每一天,然后用填充它们适当的价值。快乐的编码。 ;-)