如何使用javascript在html上获取上个月和下个月的结果
[英]how to get previous month and next month results on html using javascript
问题描述
I have this code which you can select date and get results according to it. 
我有这段代码，您可以选择日期并根据它获得结果。 Now in the place of months and years selection i want a button that shows previous month and another button that shows next month. 现在，在选择月份和年份的地方，我需要一个显示上个月的按钮和另一个显示下个月的按钮。 Like that Next day and previous day. 这样第二天和前一天。 Can someone please help me with this code snippet. 有人可以帮我这个代码片段。
1. Button one - Previous month 2. Button two - Next month 3. Button three - Previous Day 4. Button four - Next Day
All results should be on HTML page. 所有结果应在HTML页面上。
<HTML> <HEAD> <TITLE></TITLE> <STYLE TYPE="text/css"> TD, TH {text-align:center} </STYLE> <SCRIPT LANGUAGE="JavaScript"> function getFirstDay(theYear, theMonth){ var firstDate = new Date(theYear,theMonth,1) return firstDate.getDay() } function getMonthLen(theYear, theMonth) { var oneDay = 1000 * 60 * 60 * 24 var thisMonth = new Date(theYear, theMonth, 1) var nextMonth = new Date(theYear, theMonth + 1, 1) var len = Math.ceil((nextMonth.getTime() - thisMonth.getTime())/oneDay) return len } var theMonths = ["January","February","March","April","May","June","July","August", "September","October","November","December"] function getObject(obj) { var theObj if (document.all) { if (typeof obj == "string") { return document.all(obj) } else { return obj.style } } if (document.getElementById) { if (typeof obj == "string") { return document.getElementById(obj) } else { return obj.style } } return null } function populateTable(form) { var theMonth = form.chooseMonth.selectedIndex var theYear = parseInt(form.chooseYear.options[form.chooseYear.selectedIndex].text) // initialize date-dependent variables var firstDay = getFirstDay(theYear, theMonth) var howMany = getMonthLen(theYear, theMonth) // fill in month/year in table header getObject("tableHeader").innerHTML = theMonths[theMonth] + " " + theYear // initialize vars for table creation var dayCounter = 1 var TBody = getObject("tableBody") // clear any existing rows while (TBody.rows.length > 0) { TBody.deleteRow(0) } var newR, newC var done=false while (!done) { // create new row at end newR = TBody.insertRow(TBody.rows.length) for (var i = 0; i < 7; i++) { // create new cell at end of row newC = newR.insertCell(newR.cells.length) if (TBody.rows.length == 1 && i < firstDay) { // no content for boxes before first day newC.innerHTML = "" continue } if (dayCounter == howMany) { // no more rows after this one done = true } // plug in date (or empty for boxes after last day) newC.innerHTML = (dayCounter <= howMany) ? dayCounter++ : "" } } } function fillYears() { var today = new Date() var thisYear = today.getFullYear() var yearChooser = document.dateChooser.chooseYear for (i = thisYear; i < thisYear + 5; i++) { yearChooser.options[yearChooser.options.length] = new Option(i, i) } setCurrMonth(today) } // set month choice to current month function setCurrMonth(today) { document.dateChooser.chooseMonth.selectedIndex = today.getMonth() } </SCRIPT> </HEAD> <BODY onLoad="fillYears(); populateTable(document.dateChooser)"> <H1>Calender</H1> <HR> <TABLE style="width:100%;height:80%;" ID="calendarTable" BORDER=1 ALIGN="center"> <TR> <TH ID="tableHeader" COLSPAN=7></TH> </TR> <TR><TH>Sun</TH><TH>Mon</TH><TH>Tue</TH><TH>Wed</TH> <TH>Thu</TH><TH>Fri</TH><TH>Sat</TH></TR> <TBODY ID="tableBody"></TBODY> <TR> <TD COLSPAN=7> <P> <FORM NAME="dateChooser"> <SELECT NAME="chooseMonth" onChange="populateTable(this.form)"> <OPTION SELECTED>January<OPTION>February <OPTION>March<OPTION>April<OPTION>May <OPTION>June<OPTION>July<OPTION>August <OPTION>September<OPTION>October <OPTION>November<OPTION>December </SELECT> <SELECT NAME="chooseYear" onChange="populateTable(this.form)"> </SELECT> </FORM> </P></TD> </TR> </TABLE> </BODY> </HTML
1 个解决方案
解决方案1
1 2019-03-09 15:24:38
I suggest to use moment.js. 我建议使用moment.js。 It helps alot when you work with time and date. 当您使用时间和日期时，它可以提供很多帮助。
eg after pressing a button "next month" you can use moment().add(1, 'months') to add 1 month to your current date. 例如，按下“下个月”按钮后，可以使用moment().add(1, 'months')将1个月添加到当前日期。 you can store the date after switching eg on data attributes or hidden input or ... 您可以在切换后存储日期，例如在数据属性或隐藏的输入或...上。
complete documentation you can find on https://momentjs.com/docs/ 您可以在https://momentjs.com/docs/上找到完整的文档
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.