学习日记之JS时间联动框

今天学习了JS的时间联动框。

HTML代码：

<body onload="initYear(document.employeetable.year)">
<fieldset >
<legend>员工表</legend>
<form name="employeetable">

<select name="year"     onchange="initMonth(document.employeetable.month,document.employeetable.day)"/>
	<option value="">&nbsp;&nbsp;&nbsp;年</option>
</select>
<select name="month" onchange="initDay(document.employeetable.year,document.employeetable.month,document.employeetable.day)">
	<option value="">&nbsp;月</option>
</select>
<select name="day">
    <option value="">&nbsp;日</option>
</select>
    
</form>
</fieldset>

JS代码

<SCRIPT type="text/javascript">
		<!-- 对年进行初始化//-->	
		function initYear(year){
			var newYear=new Date().getFullYear();
			for(var i=newYear+3;i>=newYear-10;i--){
				year.options.add(new Option(i,i));
			}
		}
		<!-- 对月进行初始化//-->
		function initMonth(month,day){
			month.options.length=1;<!--清空月//-->
			day.options.length=1;<!--清空日//-->
			for(var j=1;j<=12;j++){
				month.options.add(new Option(j,j));
			} 
		}
		<!-- 对日进行初始化//--> 
		function initDay(year,month,day){
			var yearValue=year.value;
			var monthValue=month.value;
			var dayValue;
			day.options.length=1;<!--清空日//-->
			<!-- 判断出该月份下有多少天//-->
			if(monthValue==4||monthValue==6||monthValue==9||monthValue==11){
				dayValue=30;
			}else if(monthValue==2){
				if(yearValue%4==0&&(yearValue%100!=0||yearValue%400==0)){
					dayValue=29;
				}else{
					dayValue=28;
				}
			}else{
				dayValue=31;	
			}
			for(var i=1;i<=dayValue;i++){
				day.options.add(new Option(i,i));
			}
		}
	
</SCRIPT>

　　至此，整个时间联动框完成了！

posted @ 2015-06-02 20:56  阿伟哈  阅读(229)  评论(0)    收藏  举报