JQuery实现日期联动

  
  

   
   <
   head
   >
   

//导入jquery地址


   <
   script 
   src
   ="（Jquery地址）"
    language
   ="JavaScript"
    type
   ="text/javascript"
   ></
   script
   >
   


   <
   script 
   type
   ="text/javascript"
   >
   


   //
   startYear发生变化
   


   function
    changeYear(str,isstart)

{


   var
    pre 
   =
    
   "
   start
   "
   ;


   if
   (isstart 
   ==
    
   false
   )

{

pre 
   =
    
   "
   end
   "
   ;

}


   var
    startMonth 
   =
    $(pre 
   +
    
   "
   Month
   "
   ).value;


   if
   (startMonth 
   ==
    
   ""
   )

{


   var
    e 
   =
    $(pre 
   +
    
   "
   Month
   "
   );

optionClear(e);


   return
   ;

}


   var
    n 
   =
    MonHead[startMonth 
   -
    
   1
   ];


   if
   (startMonth 
   ==
    
   2
     
   &&
    IsPinYear($(pre 
   +
    
   "
   Year
   "
   ).value))

{

n
   ++
   ;

}

writeDay(n,pre);

}


   function
    changeMonth(str,isstart)

{


   var
    pre 
   =
    
   "
   start
   "
   ;


   if
   (isstart 
   ==
    
   false
   )

{

pre 
   =
    
   "
   end
   "
   ;

}


   var
    year 
   =
    $(pre 
   +
    
   "
   Year
   "
   ).value;


   if
   (year 
   ==
    
   ""
   )

{


   var
    e 
   =
    $(pre 
   +
    
   "
   Day
   "
   );

optionClear(e);


   return
   ;

}


   var
    n 
   =
    MonHead[str 
   -
    
   1
   ];


   if
   (str 
   ==
    
   2
    
   &&
    IsPinYear($(pre 
   +
    
   "
   Year
   "
   )))

{

n
   ++
   ;

}

writeDay(n,pre);

}




   function
    dateStart()

{


   var
    defaultStartY 
   =
    
   "
   2011
   "
   ;


   var
    defaultStartM 
   =
    
   "
   1
   "
   ;


   var
    defaultStartD 
   =
    
   "
   14
   "
   ;




   var
    defaultEndY 
   =
    
   "
   2011
   "
   ;


   var
    defaultEndM 
   =
    
   "
   2
   "
   ;


   var
    defaultEndD 
   =
    
   "
   23
   "
   ;



MonHead 
   =
    [
   31
   ,
   28
   ,
   31
   ,
   30
   ,
   31
   ,
   30
   ,
   31
   ,
   31
   ,
   30
   ,
   31
   ,
   30
   ,
   31
   ];




   var
    prestr 
   =
    
   new
    Array(
   "
   start
   "
   ,
   "
   end
   "
   );


   for
   (
   var
    j
   =
   0
   ; j
   <
   2
   ; j
   ++
   )

{


   var
    pre 
   =
    prestr[j];


   //
   start 年
   


           
   var
    y 
   =
    
   new
    Date().getFullYear();


   if
   (pre 
   ==
    
   "
   start
   "
   )

{


   //
   start初始选中前第10天
   


               
   var
    i_index 
   =
    
   0
   ;


   for
   (
   var
    i
   =
   (y
   -
   10
   ); i
   <=
   y; i
   ++
   )

{

$(pre
   +
   "
   Year
   "
   ).options.add(
   new
    Option(
   ""
   +
   i
   +
   ""
   ,i));


   if
   (i 
   ==
    defaultStartY)

{

$(pre
   +
   "
   Year
   "
   ).options[i_index].selected 
   =
    
   true
   ;

}

i_index
   ++
   ;

}



}


   else
   

{


   var
    i_index 
   =
   0
   ;


   for
   (
   var
    i
   =
   (y
   -
   5
   ); i
   <=
   y
   +
   5
   ; i
   ++
   )

{

$(pre
   +
   "
   Year
   "
   ).options.add(
   new
    Option(
   ""
   +
   i
   +
   ""
   ,i));


   if
   (i 
   ==
    defaultEndY)

{

$(pre
   +
   "
   Year
   "
   ).options[i_index].selected 
   =
    
   true
   ;

}

i_index
   ++
   ;

}

}


   //
   start月
   


           defaultM 
   =
    (pre 
   ==
    
   "
   start
   "
    
   ?
    defaultStartM : defaultEndM)


   for
   (
   var
    i 
   =
    
   1
   ; i 
   <
    
   13
   ; i
   ++
   )

{

$(pre 
   +
    
   "
   Month
   "
   ).options.add(
   new
    Option(
   ""
   +
   i
   +
   ""
   ,i));


   if
   (i 
   ==
    defaultM)

{

$(pre 
   +
    
   "
   Month
   "
   ).options[i
   -
   1
   ].selected 
   =
    
   true
   ;

}

}


   //
   start日
   


           
   var
    n 
   =
    MonHead[$(pre 
   +
    
   "
   Month
   "
   ).value];


   if
   (
   new
    Date().getMonth 
   ==
    
   1
     
   &&
    IsPinYear($(pre 
   +
    
   "
   Year
   "
   ).value))

{

n
   ++
   ;

}

defaultD 
   =
    (pre 
   ==
    
   "
   start
   "
    
   ?
    defaultStartD : defaultEndD)

writeDay(n,pre);

$(pre 
   +
    
   "
   Day
   "
   ).options[defaultD
   -
   1
   ].selected 
   =
    
   true
   ;

}

}


   function
    writeDay(n,pre)

{


   var
    e 
   =
    $(pre 
   +
    
   "
   Day
   "
   );

optionClear(e);


   for
    (
   var
    i
   =
   1
   ; i
   <
   (n
   +
   1
   ); i
   ++
   )

{

e.options.add(
   new
    Option(
   ""
   +
   i
   +
   ""
   ,i));

}

}


   function
    IsPinYear(year)

{


   return
    (
   0
    
   ==
    year
   %
   4
    
   &&
    (year
   %
   100
    
   !=
    
   0
    
   ||
    year 
   %
    
   4
    
   ==
    
   0
   ));

}




   function
    optionClear(e)

{


   for
   (
   var
    i
   =
   e.options.length; i
   >=
   0
   ; i
   --
   )

{

e.remove(i);

}

}


   </
   script
   >
   


   </
   head
   >
   


   <
   body 
   onload
   ="dateStart()"
   >
   


   <
   p 
   name
   ="selectdate"
   >
   

从


   <
   select 
   id
   ="startYear"
    name
   ="startYear"
    onchange
   ="changeYear(this.value,true)"
   >
   


   </
   select
   >
   

年


   <
   select 
   id
   ="startMonth"
    name
   ="startMonth"
    onchange
   ="changeMonth(this.value,true)"
   >
   


   </
   select
   >
   

月


   <
   select 
   id
   ="startDay"
    name
   ="startDay"
   >
   


   </
   select
   >
   

日

到


   <
   select 
   id
   ="endYear"
    name
   ="endYear"
    onchange
   ="changeYear(this.value,false)"
   >
   


   </
   select
   >
   

年


   <
   select 
   id
   ="endMonth"
    name
   ="endMonth"
    onchange
   ="changeMonth(this.value,false)"
   >
   


   </
   select
   >
   

月


   <
   select 
   id
   ="endDay"
    name
   ="endDay"
   >
   


   </
   select
   >
   

日


   </
   p
   >
   


   </
   body
   >