This article shares the specific code for JavaScript to achieve the time range effect for your reference. The specific content is as follows Time range before the current time (six months ago)Rendering js file code snippet /*Query date range (current time forward) Add By Vivian 2020/12/04 */ //rangeVal: the separator between two dates num: the interval timeType: the time type function funGetRangeDateByLess(rangeVal,num,timeType){ var returnVal=""; var otherVal=""; var otherTime=""; var curTime = new Date(); var curTimeVal = curTime.getFullYear() + '-' + PrefixZero((curTime.getMonth() + 1), 2) + '-' + PrefixZero(curTime.getDate(), 2); switch (timeType) { case 1://var addMinutes = curTime.setMinutes(curTime.getMinutes() - num); otherTime=new Date(addMinutes); break; case 2://var addMinutes = curTime.setHours(curTime.getHours() - num); otherTime=new Date(addMinutes); break; case 3://dayvar addDate = curTime.setDate(curTime.getDate() - num); otherTime=new Date(addDate); break; case 4://monthvar addMonth = curTime.setMonth(curTime.getMonth() - num); otherTime=new Date(addMonth); break; case 5://yearvar addYear = curTime.setFullYear(curTime.getFullYear() - num); otherTime=new Date(addYear); break; default: break; } otherVal = otherTime.getFullYear() + '-' + PrefixZero((otherTime.getMonth() + 1), 2) + '-' + PrefixZero(otherTime.getDate(), 2); return returnVal=otherVal+rangeVal+curTimeVal; } /*Automatically fill in zeros Add By Vivian 2020/12/04 */ function PrefixZero(num, n) { return (Array(n).join(0) + num).slice(-n); } Using Code Snippets var fillhelptime=funGetRangeDateByLess(" , ",6,4); laydate.render({ elem: "#fillhelptime", range: ",", type: 'date', value:fillhelptime, //default value }); The time range of a date (how many days before and after) Rendering js file code snippet /*Query the date range (how many days before and after a certain date) Add By Vivian 2021/04/06 */ //rangeVal: the separator between two datesdate: a certain datebeforeDays: the first N daysafterDays: the last N daysfunction funGetRangeDateByBeforeAndAfter(rangeVal,date,beforeDays,afterDays){ var dateVaule1 = new Date(date);//Convert to time format var dateVaule2 = new Date(date);//Convert to time format var startDate = new Date(dateVaule1.setDate(dateVaule1.getDate() - beforeDays));//First N days var endDate = new Date(dateVaule2.setDate(dateVaule2.getDate() + afterDays));//Later N days var date1 = startDate.getFullYear() + '-' + PrefixZero((startDate.getMonth() + 1), 2) + '-' + PrefixZero(startDate.getDate(), 2); var date2 = endDate.getFullYear() + '-' + PrefixZero((endDate.getMonth() + 1), 2) + '-' + PrefixZero(endDate.getDate(), 2); var returnVal=date1+rangeVal+date2; return returnVal; } /*Automatically fill in zeros Add By Vivian 2020/12/04 */ function PrefixZero(num, n) { return (Array(n).join(0) + num).slice(-n); } The time range of a certain point in time (how many days before and after)Rendering js file code snippet /*Query the date range (how much time before and after a certain time point) Add By Vivian 2021/04/06 */ //rangeVal: the separator between two dates timeType: the time type between them date: a certain date beforeDays: the first N days afterDays: the last N days function funGetRangeDateByBeforeAndAfter(rangeVal,timeType,date,beforeNum,afterNum){ var dateVaule1 = new Date(date);//Convert to time format var dateVaule2 = new Date(date);//Convert to time format var startDate = ""; var endDate = ""; switch (timeType) { case 1://startDate = new Date(dateVaule1.setMinutes(dateVaule1.getMinutes() - beforeNum));//First N minutesendDate = new Date(dateVaule2.setMinutes(dateVaule2.getMinutes() + afterNum));//After N minutesbreak; case 2://startDate = new Date(dateVaule1.setHours(dateVaule1.getHours() - beforeNum));//First N hoursendDate = new Date(dateVaule2.setHours(dateVaule2.getHours() + afterNum));//After N hoursbreak; case 3://daysstartDate = new Date(dateVaule1.setDate(dateVaule1.getDate() - beforeNum));//First N daysendDate = new Date(dateVaule2.setDate(dateVaule2.getDate() + afterNum));//After N daysbreak; case 4://monthstartDate = new Date(dateVaule1.setMonth(dateVaule1.getMonth() - beforeNum));//first N monthsendDate = new Date(dateVaule2.setMonth(dateVaule2.getMonth() + afterNum));//after N monthsbreak; case 5://yearstartDate = new Date(dateVaule1.setFullYear(dateVaule1.getFullYear() - beforeNum));//First N yearsendDate = new Date(dateVaule2.setFullYear(dateVaule2.getFullYear() + afterNum));//After N yearsvar addYear = curTime.setFullYear(curTime.getFullYear() - num); break; default: break; } var returnVal1 = startDate.getFullYear() + '-' + PrefixZero((startDate.getMonth() + 1), 2) + '-' + PrefixZero(startDate.getDate(), 2); var returnVal2 = endDate.getFullYear() + '-' + PrefixZero((endDate.getMonth() + 1), 2) + '-' + PrefixZero(endDate.getDate(), 2); var returnVal=returnVal1+rangeVal+returnVal2; return returnVal; } /*Automatically fill in zeros Add By Vivian 2020/12/04 */ function PrefixZero(num, n) { return (Array(n).join(0) + num).slice(-n); } The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. You may also be interested in:
|
<<: Common operation commands of MySQL in Linux system
>>: nginx automatically generates configuration files in docker container
In daily development, database addition, deletion...
Docker provides multiple networks such as bridge,...
Table of contents Preface About webSocket operati...
Preface: In some application scenarios, we often ...
1 Download MySQL8 from the official website and i...
This article records the installation and configu...
Conventional solution Use FileReader to read the ...
I spent a day on it before this. Although Seata i...
The vue part is as follows: <template> <...
Table of contents 1. Union Type 2. Crossover Type...
1. Still use PHP script to execute. Command line ...
1. Download and install the official MySQL Yum Re...
1. Windows Server 2019 Installation Install Windo...
This article records the detailed tutorial of MyS...
1. Use the shortcut Ctrl + Shift + P to call out ...