js实现下拉框联动选中日期（select 日期联动更改）

最新推荐文章于 2023-04-19 22:13:22 发布

zh921112

最新推荐文章于 2023-04-19 22:13:22 发布

阅读量2.1w

点赞数

分类专栏： Java 文章标签： js javascript select 日期联动

Java 专栏收录该内容

43 篇文章 1 订阅

订阅专栏

html代码

<head>
<script type="text/javascript" src="/js/jquery-1.11.1.min.js" ></script>
<script type="text/javascript" src="/js/party.js" ></script>
</head>
<body>
<table style="text-align: right;">
		<tr>
			<td>出生日期：</td>
			<td><select id="birth_year" οnchange="setDays(this,birth_month,birth_day);">
					<option value="">年</option>
					
			</select> <select id="birth_month" οnchange="setDays(birth_year,this,birth_day);">
					<option value="">月</option>
					
			</select> <select id="birth_day">
					<option value="">日</option>
					
			</select></td>
		</tr>
		<tr>
</table>
</body>

js 代码

$(document).ready(function() {
	var i = -1;
	// 添加年份，从1910年开始
	for (i = 1910; i <= new Date().getFullYear(); i++) {
		addOption(birth_year, i, i - 1909);
		/*// 默认选中1988年
	    if (i == 1988) {
	    	birth_year.options[i-1910].selected = true;
	    }*/
	}
	// 添加月份
	for (i = 1; i <= 12; i++) {
	     addOption(birth_month, i, i);
	}
	// 添加天份，先默认31天
	for (i = 1; i <= 31; i++) {
	    addOption(birth_day, i, i);
	}
	
	
	
	//$("#birth_month"). birth_year  birth_day
});

	 
// 设置每个月份的天数
function setDays(year, month,day) {
	var monthDays = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
	var yea = year.options[year.selectedIndex].text;
	var mon = month.options[month.selectedIndex].text;
	var num = monthDays[mon - 1];
	if (mon == 2 && isLeapYear(yea)) {
		num++;
	}
	for (var j = day.options.length - 1; j >=num; j--) {
           day.remove(j);
       }
       for (var i = day.options.length; i <= num; i++) {
           addOption(birth_day,i,i);
       }
}
	 
// 判断是否闰年
function isLeapYear(year)
{
	return (year % 4 == 0 || (year % 100 == 0 && year % 400 == 0));
}
	 
// 向select尾部添加option
function addOption(selectbox, text, value) {
	var option = document.createElement("option");
	option.text = text;
    option.value = value;
    selectbox.options.add(option);
}

原文地址：http://www.cnblogs.com/qingliuyu/archive/2010/10/21/1857586.html