Question

日历可能在星期一开始吗？我在一个教程中找到了这个，但我的JS知识并不令人满意。我改变了一些价值但没有成功。

<script type="text/javascript">
function Calendar(id, year, month) { 
  var elem = document.getElementById(id)

  var mon = month - 1  // (1)
  var d = new Date(year, mon)

  var table = ['<table><tr>']

  // (2) fill first row 
  //  0  1  2  3  4  5  6
  // 29 30 31| 1  2  3  4  
  for (var i=0; i<d.getDay(); i++) {
    table.push('<td></td>')
  }

  // main body (3)
  while(d.getMonth() == mon) {
    table.push('<td>'+d.getDate()+'</td>')

    if (d.getDay() % 7 == 6) {   // (4)
      table.push('</tr><tr>')
    }

    d.setDate(d.getDate()+1)  
  }

  // (5) table tail
  for (var i=d.getDay(); i<7; i++) {
    table.push('<td></td>')
  }

  table.push('</tr></table>')

  elem.innerHTML = table.join('\n')
}
new Calendar("cal", 2015, 9)
</script>

Answer 1

第一行的列需要左移，行中断设置为＆＃39; 0＆＃39; （星期日）。

     var firstRow_col = (d.getDay() + 6) % 7;
     for (var i=0; i<firstRow_col; i++) {
         table.push('<td></td>')
     }

      ...

     if (d.getDay() % 7 == 0) {   // (4)
          table.push('</tr><tr>')
     }

编辑：意识到如果桌面样式变得可见，也需要清理尾部。

例如：

    if (d.getDay() !== 0)  {
         for (var i=0; i < 8 - d.getDay(); i++) {
             table.push('<td></td>')
         }
    }

查看完整代码和演示：

＆＃13;

     function Calendar(id, year, month) {
       var elem = document.getElementById(id)

       var mon = month - 1 // (1)
       var d = new Date(year, mon)

       var table = ['<table><tr>']

       // (2) fill first row 
       //  0  1  2  3  4  5  6
       // 29 30 31| 1  2  3  4  
       //   for (var i=0; i<d.getDay(); i++) {
       var firstRow_col = (d.getDay() + 6) % 7;
       for (var i = 0; i < firstRow_col; i++) {
         table.push('<td></td>')
       }

       // main body (3)
       while (d.getMonth() == mon) {
         table.push('<td>' + d.getDate() + '</td>')

         // if (d.getDay() % 7 == 6) {   // (4)
         if (d.getDay() % 7 == 0) { // (4)
           table.push('</tr><tr>')
         }

         d.setDate(d.getDate() + 1)
       }

       // (5) table tail
       for (var i = d.getDay(); i < 7; i++) {
         table.push('<td></td>')
       }

       table.push('</tr></table>')

       elem.innerHTML = table.join('\n')
     }
     new Calendar("cal1", 2015, 1)
      new Calendar("cal2", 2015, 2)
      new Calendar("cal3", 2015, 3)
      new Calendar("cal4", 2015, 4)
      new Calendar("cal5", 2015, 5)
      new Calendar("cal6", 2015, 6)
      new Calendar("cal7", 2015, 7)
      new Calendar("cal8", 2015, 8)
      new Calendar("cal9", 2015, 9)
      new Calendar("cal10", 2015, 10)
      new Calendar("cal11", 2015, 11)
      new Calendar("cal12", 2015, 12)

＆＃13;

Jan <div id="cal1"></div><hr>
Feb <div id="cal2"></div><hr>
Mar <div id="cal3"></div><hr>
Apr <div id="cal4"></div><hr>
May <div id="cal5"></div><hr>
Jun <div id="cal6"></div><hr>
Jul <div id="cal7"></div><hr>
Aug <div id="cal8"></div><hr>
Sep <div id="cal9"></div><hr>
Oct <div id="cal10"></div><hr>
Nov <div id="cal11"></div><hr>
Dec <div id="cal12"></div><hr>

＆＃13;

Answer 2

函数Calendar（除非您打算将其用作对象，否则它之前不需要new），取year和month参数并创建一个月份的表格，类似于美国日历的样子。

您的示例输入是2015年9月，从周二开始。如果您希望它在星期一开始，那么您可以输入从2015年6月开始的星期一开始的月份（即Calendar("cal", 2015, 6);）。

该函数使用这段代码来正确分隔月份第一天的方式：

for (var i=0; i<d.getDay(); i++) {
    table.push('<td></td>')
}

d.getDay()返回Date对象d的星期几。因此，如果d是星期一，则d.getDay()会返回1。这段代码会将1添加到i，直到它等于d.getDay()，并且每次都会添加一个空表格单元格（"<td></td>"）。

对于那里，它将d增加一天，同时将表格单元格添加到表格中，同时每次到达第7天时结束行。

编辑：

误解了你的意思＆＃34;从周一开始＆＃34;。就像Key Lime Tartlet所说的那样，你只需要将d.getDay()换成-1，这样星期日基本上就是星期一。

日历 - 编辑脚本

2 个答案: