我正在尝试使用 JavaScript 为学校作业制作日历，在我的 Function Kalander 循环中，我尝试在 和 中生成该月的天数。我不太确定我如何适合循环内的开口。我想要 7 天的行。
HMTL:
html>
<head>
</head>
<body>
<center>
<button id="Vorige" onclick="VorigeFunc()">Vorige</button> <button id="Volgende" onclick="VolgendeFunc()">Volgende</button>
<br>
<table id="cal">
</table>
<div id="div">
<script type="text/javascript" src="Kal.js"> </script>
</div>
</center>
</body>
</html>
JavaScript:
var dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
var today = new Date();
var dag = today.getDay();
var myMonth = today.getMonth();
var jaar = today.getFullYear();
var VolgendeFunc = function(){
myMonth = myMonth + 1;
Kalender();
}
var VorigeFunc = function(){
myMonth = myMonth -1;
Kalender();
}
function Kalender(){
var myHTML ='';
myHTML+=monthNames[myMonth] + " " + jaar + "<br>";
for (var i=1; i <= monthLength[myMonth]; i++)
{
myHTML+="<td><a href='#'>" + i + "</a></<td> ";
if (i%7 == 0) { myHTML += "</tr>"; }
}
document.getElementById('div').innerHTML = myHTML;
}
window.onload=Kalender();
最佳答案
要解决您的问题，您需要选择正确的容器。我已从标记中删除了您的表格，并使用您的 JS 动态添加了它。
我已将月份放在另一个容器中，以免干扰 table 。您可以选择将月份放置在 thead 标记内。
我给了你一份奖金，并为 2014 年添加了按钮功能和限制行为(将其改进为不受限制的年份日历)。让它成为你的练习。
HTML
<button id="Vorige" onclick="VorigeFunc();">Vorige</button>
<button id="Volgende" onclick="VolgendeFunc();">Volgende</button>
<br>
<div id="div">
</div>
JS
var dayNames = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var monthLength = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
var today = new Date();
var dag = today.getDay();
var myMonth = today.getMonth();
var jaar = today.getFullYear();
var volBtn = document.getElementById('Volgende');
var vorBtn = document.getElementById('Vorige');
function Kalender(){
var myHTML ='';
myHTML+='<div id="month">'+monthNames[myMonth] + " " + jaar+'</div><table id="cal">';
for (var i=1; i <= monthLength[myMonth]; i++){
myHTML+="<td><a href='#'>" + i + "</a></<td> ";
if (i%7 == 0){
myHTML += "</tr>";
}
}
myHTML+='</table>';
document.getElementById('div').innerHTML = myHTML;
}
var VolgendeFunc = function(){
myMonth = myMonth + 1;
if (myMonth == 11){
volBtn.disabled = true;
vorBtn.disabled = false;
} else {
vorBtn.disabled = false;
volBtn.disabled = false;
}
document.getElementById('month').innerHTML = myMonth;
Kalender();
}
var VorigeFunc = function(){
myMonth = myMonth - 1;
if (myMonth == 0){
vorBtn.disabled = true;
volBtn.disabled = false;
} else {
vorBtn.disabled = false;
volBtn.disabled = false;
}
document.getElementById('month').innerHTML = myMonth;
Kalender();
}
Kalender();
关于JavaScript 循环与 <tr>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26486482/