Simple date drop-down selector implemented by JavaScript

When I work, I need something that allows me to select a date. Because the requirements are not high, I just need to simply select the year, month, and day, you will not use canledar to learn some JS processing knowledge.CodePaste it out. You are welcome to make a brick.

 

Code
Function Fillyears (){
VaR Date =   New Date ();
VaR Curryear = Date. getfullyear ();
For ( VaR I = Curryear; I < Curryear +   10 ; I ++ ){ // This can only be shown in the next ten years
Selyear. Options [selyear. Options. Length] =   New Option (I. tostring (), I );
}
}

Function Fillmonths (){
VaR Date =   New Date ();
VaR Curryear = Date. getfullyear ();
VaR Currmonth = Date. getmonth () +   1 ;
// Clear original month
For ( VaR I = Selmonth. Options. length; I >   0 ; I -- ){
Selmonth. Options. Remove (I -   1 );
}
VaR Selectedyear = Parseint (selyear. Options [selyear. selectedindex]. value );
// If this year is selected, the month is displayed from this month.
If (Selectedyear = Curryear ){
// Add new month
For ( VaR I = Currmonth; I <=   12 ; I ++ ){
Selmonth. Options [selmonth. Options. Length] =   New Option (I, I );
}
}
Else {
For ( VaR I =   1 ; I <=   12 ; I ++ ){
Selmonth. Options [selmonth. Options. Length] =   New Option (I, I );
}
}
}

Function Filldays (){
VaR Date =   New Date ();
VaR Curryear = Date. getfullyear ();
VaR Currmonth = Date. getmonth () +   1 ;
VaR Currday = Date. getdate ();
// Clear all days
For ( VaR I = Selday. Options. length; I >   0 ; I -- ){
Selday. Options. Remove (I -   1 );
}
VaR Selectedyear = Parseint (selyear. Options [selyear. selectedindex]. value );
VaR Selectedmonth = Parseint (selmonth. Options [selmonth. selectedindex]. value );
If (Selectedyear = Curryear && Selectedmonth = Currmonth ){
VaR Tempdate =   New Date (curryear, currmonth, 0 );
For ( VaR I = Currday; I <= Tempdate. getdate (); I ++ ){
Selday. Options [selday. Options. Length] =   New Option (I, I );
}
}
Else {
VaR Tempdate =   New Date (selectedyear, selectedmonth, 0 );
VaR Days = Tempdate. getdate ();
For ( VaR I =   1 ; I <= Days; I ++ ){
Selday. Options [selday. Options. Length] =   New Option (I, I );
}
}
}

Function Fillhours (){
VaR Date =   New Date ();
VaR Curryear = Date. getfullyear (); // This is obtained this year.
VaR Currmonth = Date. getmonth () +   1 ;
VaR Currday = Date. getdate (); // This is the date of today.
VaR Currhour = Date. gethours ();
For ( VaR I = Selhour. Options. length; I >   0 ; I -- ){
Selhour. Options. Remove (I -   1 );
}
VaR Selectedyear = Parseint (selyear. Options [selyear. selectedindex]. value );
VaR Selectedmonth = Parseint (selmonth. Options [selmonth. selectedindex]. value );
VaR Selectedday = Parseint (selday. Options [selday. selectedindex]. value );
If (Selectedyear = Curryear) &&
(Selectedmonth = Currmonth)
&& (Selectedday = Currday )){
For ( VaR I = Currhour; I <=   24 ; I ++ ){
Selhour. Options [selhour. Options. Length] =   New Option (I, I );
}
} Else {
For ( VaR I =   1 ; I <=   24 ; I ++ ){
Selhour. Options [selhour. Options. Length] =   New Option (I, I );
}
}
}

The above is filled with selyear, selmonth, seldaySource code. Fill in $ (document). Ready In jquery and specify its behavior. The Code is as follows:

Code
$ (Document). Ready ( Function (){
Fillyears ();
Fillmonths ();
Filldays ();
Fillhours ();
Selyear. onchange =   Function () {Fillmonths (); filldays (); fillhours ();};
Selmonth. onchange =   Function () {Filldays (); fillhours ();};
Selday. onchange =   Function () {Fillhours ();};
});

Selyear, selmonth, and selday are used here. I will simulate this effect below, but I will not use it in $ (document ). in ready, select is used to enable the event in the button. Don't tell me you don't know how to implement this effect in the button. In fact, you just need to move the items in ready.

Year

Month

Day

Hour