Native js implements date linkage _ javascript skills

Date interaction is a common feature. You can find more than N codes at random. Today, we will introduce you to the commonly used code, which is simple and efficient, here we will give it to you. Because too many conditions are involved in the determination of the month, if you use if else, the performance will be greatly reduced. We recommend that you use the switch syntax.

The Code is as follows:

The Code is as follows:

GetDays: function (year, month ){
// Var aDay = [|, 31, 31, 31];
// Data processing of days in January
Var FedDays = year % 4 = 0? 29:28,
ReturnDays = '';
Var month = month <10? Month = '0' + month: month. toString ();
Switch (month ){
Case '01 ':
Case '03 ':
Case '05 ':
Case '07 ':
Case '08 ':
Case '10 ':
Case '12': returnDays = 31; break;
Case '04 ':
Case '06 ':
Case '09 ':
Case '11': returnDays = 30; break;
Case '02': returnDays = FedDays; break;
}
Return returnDays;
}

Complete source code:

The Code is as follows:

/* Author: laoguoyong
------------------------------
Date-level three linkage, range Selection
------------------------------
Parameters
* [String] targets: '# year, # month, # Day'; year, month, and day id
* [String] range: '2017-02-03,9 9-09-21 '; range, in the correct format: xxxx-xx
---- To save code, enter the correct date range parameter
---- Error example:
(1) range: '2017-02-03,2019-9-21 'is incorrect. Pay attention to the date format.
(2) range: '2017-02-03 'is incorrect. Enter the value of the complete range.
(3) range: '2014-02-2013--02-30 'is incorrect, and there are no 30 days since January 1 ,.
(3) range: '2017-02-03,2011-02-30 'is incorrect, and the range is incorrect.
*
*/
Function GySetDate (opt ){
// Elem
Var targets = opt.tar gets. split (',');
This. eYear = this. getId (targets [0]. slice (1 ));
This. eMonth = this. getId (targets [1]. slice (1 ));
This. eDay = this. getId (targets [2]. slice (1 ));
If (! This. eYear |! This. eMonth |! This. eDay) return;
// Range value
Var r = opt. range. indexOf (','),
AStarts = opt. range. slice (0, r). split ('-'), // convert to: ['123', '05 ', '20']
AEnds = opt. range. slice (r + 1, opt. range. length ). split ('-'); // convert to: ['123', '08', '20']
// Number type
This. startYear = parseInt (aStarts [0], 10 );
This. startMonth = parseInt (aStarts [1], 10 );
This. startDay = parseInt (aStarts [2], 10 );
This. endYear = parseInt (aEnds [0], 10 );
This. endMonth = parseInt (aEnds [1], 10 );
This. endDay = parseInt (aEnds [2], 10 );

This. init ();
}
GySetDate. prototype = {
Init: function (){
Var _ that = this;
// Initialization date
This. setYears ({'start': this. startYear, 'end': this. endYear });
This. setMonths ({'start': this. startMonth });
This. setDays ({'Year': this. startYear, 'month': this. startMonth, 'start': this. startDay });
// Select Year
This. eYear. onchange = function (){
Var year = parseInt (this. value );
Switch (true ){
Case (year = _ that. startYear ):{
_ That. setMonths ({'start': _ that. startMonth });
_ That. setDays ({'Year': _ that. startYear, 'month': _ that. startMonth, 'start': _ that. startDay });
}; Break;
Case (year = _ that. endYear ):{
_ That. setMonths ({'start': 1, 'end': _ that. endMonth });
If (_ that. endMonth> 1 ){
_ That. setDays ({'Year': _ that. endYear, 'month': 1, 'start': 1 });
} Else {
_ That. setDays ({'Year': _ that. endYear, 'month': 1, 'start': 1, 'end': _ that. endDay });
}
}; Break;
Default :{
_ That. setMonths ({'start': 1 });
_ That. setDays ({'start': 1, 'Year': year, 'month': 1 });
}
}

}
// Select monthly
This. eMonth. onchange = function (){
Var year = parseInt (_ that. eYear. options [_ that. eYear. selectedIndex]. value ),
Month = parseInt (this. value );
Switch (true ){
Case (year = _ that. endYear & month = _ that. endMonth ):{
_ That. setDays ({'start': 1, 'Year': year, 'month': month, 'end': _ that. endDay });
}; Break;
Case (year = _ that. startYear & month = _ that. startMonth ):{
_ That. setDays ({'Year': _ that. startYear, 'month': _ that. startMonth, 'start': _ that. startDay });
}; Break;
Default :{
_ That. setDays ({'start': 1, 'Year': year, 'month': month });
}
}

}
},
/* Set year, month, and day
----------------------------------
The parameter values are of the Number type.
*/
// Parameter {'start': xx, 'end': xxx}
SetYears: function (opt ){
This. eYear. innerHTML = '';
For (var n = opt. start; n <= opt. end; n ++ ){
This. eYear. add (new Option (n, n ));
}
},
// Parameter {'start': xx, 'end': xxx}
// The 'end' parameter is optional. If this parameter is ignored, the value starts from January 1, December.
SetMonths: function (opt ){
This. eMonth. innerHTML = '';
Var months = opt. end | 12;
For (var n = opt. start; n <= months; n ++ ){
If (n <10) n = '0' + n;
This. eMonth. add (new Option (n, n ));
}
},
// Parameter {'start': xx, 'Year': xxx, 'month': xx, 'star': xx, 'end': xxx}
// The 'end' parameter is optional. If this parameter is ignored, it starts from the end of this month (determined by month)
SetDays: function (opt ){
This. eDay. innerHTML = '';
Var days = opt. end | this. getDays (opt. year, opt. month );
For (var n = opt. start; n <= days; n ++ ){
If (n <10) n = '0' + n;
This. eDay. add (new Option (n, n ));
}
},
/* Returns the correct number of days based on the year and month, for example, 2016-2. The return value is 29 days (runyear)
--------------------------------------------------------------
The parameter values are of the Number type.
*/
GetDays: function (year, month ){
// Var aDay = [|, 31, 31, 31];
// Data processing of days in January
Var FedDays = year % 4 = 0? 29:28,
ReturnDays = '';
Var month = month <10? Month = '0' + month: month. toString ();
Switch (month ){
Case '01 ':
Case '03 ':
Case '05 ':
Case '07 ':
Case '08 ':
Case '10 ':
Case '12': returnDays = 31; break;
Case '04 ':
Case '06 ':
Case '09 ':
Case '11': returnDays = 30; break;
Case '02': returnDays = FedDays; break;
}
Return returnDays;
},
/* Auxiliary tool Functions
----------------------------------
*/
GetId: function (id ){
Return document. getElementById (id );
}
}

Effect diagram:

The effect is not bad. Let's use your project to beautify it.