JavaScript如何使用getDate()修复一个月内的日期?

时间:2017-01-11 22:50:29

标签: javascript

我创建了一个日历,可以自动显示您想要的任何月份并将其显示在表格中。出于某种原因,虽然我在我的JavaScript部分中使用getDate()来获取该月的天数,但这是不正确的。这是一个例子。

要获得本月的日期,我就是这样做的。

var DaysInMonth = new Date(Year, Month, 0).getDate();

2017年1月,它表示该月有31天。哪个是对的。现在,如果我们再次单击该按钮,它将转到二月,但它表示该月有31天。让我们试试March。现在它说3月有28天了。如果我们再次点击它会说4月有31天。

正如你所看到的,这很奇怪。我不确定自己做错了什么/它搞砸了什么。这是所有代码的链接。

http://www.w3schools.com/code/tryit.asp?filename=FBNGPFXV841A



var Month = 0;
var Month1 = -1;
var Year = 2017;

function NextMonth() {
  Month = Month + 1;
  Month1 = Month1 + 1;

  if (Month == 1) {
    document.getElementById("MonthTitle").innerHTML = "January " + Year;
  } else if (Month == 2) {
    document.getElementById("MonthTitle").innerHTML = "February " + Year;
  } else if (Month == 3) {
    document.getElementById("MonthTitle").innerHTML = "March " + Year;
  } else if (Month == 4) {
    document.getElementById("MonthTitle").innerHTML = "April " + Year;
  } else if (Month == 5) {
    document.getElementById("MonthTitle").innerHTML = "May " + Year;
  } else if (Month == 6) {
    document.getElementById("MonthTitle").innerHTML = "June " + Year;
  } else if (Month == 7) {
    document.getElementById("MonthTitle").innerHTML = "July " + Year;
  } else if (Month == 8) {
    document.getElementById("MonthTitle").innerHTML = "August " + Year;
  } else if (Month == 9) {
    document.getElementById("MonthTitle").innerHTML = "September " + Year;
  } else if (Month == 10) {
    document.getElementById("MonthTitle").innerHTML = "October " + Year;
  } else if (Month == 11) {
    document.getElementById("MonthTitle").innerHTML = "November " + Year;
  } else if (Month == 12) {
    document.getElementById("MonthTitle").innerHTML = "December " + Year;
  } else if (Month == 13) {
    Month = 1;
    Year = Year + 1;
    document.getElementById("MonthTitle").innerHTML = "January " + Year;
  }

  var RowNum = 0;
  var RowID = 10;
  var TotalNum = 0;
  while (TotalNum < 35) {
    TotalNum = TotalNum + 1;
    RowNum = RowNum + 1;
    if (RowNum == 8) {
      RowNum = 1;
      RowID = RowID + 10;
    }
    document.getElementById(RowID + RowNum).innerHTML = "&nbsp;";
  }

  var ID = 11;
  var Current = 1;
  var WeekNum = 0;
  var DaysInMonth = new Date(Year, Month1, 0).getDate();
  var WeekDay = new Date(Year, Month1, Current).getDay();
  document.getElementById("MonthTitle").innerHTML = DaysInMonth + " " + WeekDay + " " + Month1;
  WeekNum = WeekDay;

  document.getElementById(ID + WeekDay).innerHTML = Current;

  while (Current < DaysInMonth) {

    Current = Current + 1;
    WeekNum = WeekNum + 1;

    if (WeekNum == 7) {
      WeekNum = 0;
      ID = ID + 10;
    }

    var WeekDay1 = new Date(Year, Month1, Current).getDay();

    document.getElementById(ID + WeekDay1).innerHTML = Current;
  }
}

function PrevMonth() {
  Month = Month - 1;
}
&#13;
td {
  vertical-align: top;
  width: 100px;
  height: 80px;
}
th {
  width: 100px;
  height: 25px;
}
#ButtonAlign {
  text-align: center;
  padding-top: 10px;
}
&#13;
<table border="1px solid black" style="border-collapse:collapse;width:80%" align="center">
  <caption id="MonthTitle" style="font-size: 50px;padding-bottom: 10px">January 2017</caption>
  <tr>
    <th>Sunday</th>
    <th>Monday</th>
    <th>Tuesday</th>
    <th>Wednesday</th>
    <th>Thursday</th>
    <th>Friday</th>
    <th>Saturday</th>
  </tr>
  <tr>
    <td id="11">1</td>
    <td id="12">2</td>
    <td id="13">3</td>
    <td id="14">4</td>
    <td id="15">5</td>
    <td id="16">6</td>
    <td id="17">7</td>
  </tr>
  <tr>
    <td id="21">8</td>
    <td id="22">9</td>
    <td id="23">10</td>
    <td id="24">11</td>
    <td id="25">12</td>
    <td id="26">13</td>
    <td id="27">14</td>
  </tr>
  <tr>
    <td id="31">15</td>
    <td id="32">16</td>
    <td id="33">17</td>
    <td id="34">18</td>
    <td id="35">19</td>
    <td id="36">20</td>
    <td id="37">21</td>
  </tr>
  <tr>
    <td id="41">22</td>
    <td id="42">23</td>
    <td id="43">24</td>
    <td id="44">25</td>
    <td id="45">26</td>
    <td id="46">27</td>
    <td id="47">28</td>
  </tr>
  <tr>
    <td id="51">29</td>
    <td id="52">30</td>
    <td id="53">31</td>
    <td id="54">&nbsp;</td>
    <td id="55">&nbsp;</td>
    <td id="56">&nbsp;</td>
    <td id="57">&nbsp;</td>
  </tr>
</table>
<div id="ButtonAlign">
  <button type="button" onclick="NextMonth()" style="width: 125px">Next Month</button>
  <button type="button" onclick="PrevMonth()" style="width: 125px">Previous Month</button>
</div>
&#13;
&#13;
&#13;

*此外,当您单击按钮时,它会将月份标题更改为3个数字。第一个是这个月有多少天。第二个是月份开始的工作日(即0-6)。最后一个是哪个月(0-11)。

2 个答案:

答案 0 :(得分:1)

var DaysInMonth = new Date(Year, Month, 0).getDate();为您提供上个月的天数(月份从0到11)。 即2月你应该像var DaysInMonth = new Date(2017, 2, 0).getDate();一样打电话。

根据您的结果,您将在二月份调用var DaysInMonth = new Date(2017, 1, 0).getDate();。所以你可以像这样修复你的代码

var DaysInMonth = new Date(Year, Month + 1, 0).getDate();

PS:另见What is the best way to determine the number of days in a month with javascript?

答案 1 :(得分:0)

在Javascript中,getMonth()值为0-11,看起来你将1月编码为1。