javascript实现简单日期下拉选择器

JavaScript代码:

<script type="text/javascript">
	function doyear(){
		var select = document.getElementById("year");
		var thisYear = new Date().getFullYear();
		for(var i=1900;i<=thisYear;i++){
			var option = document.createElement("option");
			option.value = i;
			option.innerText = i;
			select.appendChild(option);
		}
	}
	
	function domoth(){
		var select = document.getElementById("month");
		for(var i=1;i<=12;i++){
			var option = document.createElement("option");
			option.value = i;
			option.innerText = i;
			select.appendChild(option);
		}
	}
	
	function doday(){
		var select = document.getElementById("day"); 
		var selectYear = parseInt(year.options[year.selectedIndex].value);
		var selectMonth = parseInt(month.options[month.selectedIndex].value); 
		var date = new Date(selectYear,selectMonth,0);
		
		for(var i=1;i<=date.getDate();i++){
			var option = document.createElement("option");
			option.value = i;
			option.innerText = i;
			select.appendChild(option);
		}
	}
	
	function deleteOldChildNodes(){
		var day = document.getElementById("day");
		var node=day.firstChild;
		var tmpNode;
		while(node!=day.lastChild){
			tmpNode = node.nextSibling;
			day.removeChild(node);
			node = tmpNode;
		}
		day.removeChild(day.lastChild);
	}
	
	function pageInit(){
		doyear();
		domoth();
		doday();
		year.onchange = function(){deleteOldChildNodes();doday();};
		month.onchange = function(){deleteOldChildNodes();doday();};
	}
</script>
HTML页面代码片:

<body style="text-align: center" οnlοad="pageInit()">
   <table width="70%" frame="border">
   	<tr>
   	<td>生日</td>
   	<td>
   		<select name="year" id="year"></select>年
   		<select name="month" id="month"></select>月
   		<select name="day" id="day"></select>日
   	</td>
   	</tr>

   </table>
 </body>







  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值