2017-01-11 28 views
1

我創建的日曆可以自動顯示您想要的月份並將其顯示在表格中。由於某些原因,儘管當我在JavaScript部分中使用getDate()來獲取一個月中有多少天時,這是不正確的。這裏有一個例子。JavaScript如何解決使用getDate()在一個月內獲取日期?

對於獲取月份日期的代碼,我正在這樣做。

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

對於2017年1月份,它表示本月有31天。哪個是對的。現在,如果我們再次點擊該按鈕,它會到2月份,但它表示本月有31天。讓我們試試三月。現在說3月有28天。如果我們再次點擊它會說四月有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; 
 
}
td { 
 
    vertical-align: top; 
 
    width: 100px; 
 
    height: 80px; 
 
} 
 
th { 
 
    width: 100px; 
 
    height: 25px; 
 
} 
 
#ButtonAlign { 
 
    text-align: center; 
 
    padding-top: 10px; 
 
}
<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>

*此外,當您單擊該按鈕,將更改月份標題3號。第一個是本月有多少天。第二個是每月開始的工作日(即0-6)。最後是哪個月(0-11)。

回答

1

var DaysInMonth = new Date(Year, Month, 0).getDate();給你上一個月的天數(其中的月份是從0至11) 。 即二月,你應該把它叫做var DaysInMonth = new Date(2017, 2, 0).getDate();

根據你的結果你打電話給它像2月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?

+0

謝謝!我沒有意識到這一點,甚至沒有考慮到它。我也會檢查鏈接。 – thebootsie123

+0

「Date()」的MDN文檔不指定此行爲,只有當參數大於允許的時間間隔時纔會發生。很高興知道這個訣竅。 – Niloct

0

在Javascript中得到月()值從0-11,它看起來像你的編碼月爲1

+0

這是一種混亂,但我有一個名爲「MONTH1」每一個按鈕是時間變量,它在-1開始出來,然後點擊它上升1.這個變量用於這個部分這裏得到的日期'var DaysInMonth = new Date(Year,Month1,0).getDate();' – thebootsie123

相關問題