js的年月日联动

最新推荐文章于 2022-06-11 23:26:31 发布

jianghu52

最新推荐文章于 2022-06-11 23:26:31 发布

阅读量815

点赞数 2

分类专栏： js 文章标签： js

本文链接：https://blog.csdn.net/jianghu52/article/details/13015791

版权

js 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本来不想自己造轮子的，但是看了一圈，js的年月日联动竟然没找到一个看的舒服的。只好自己写一个。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>YMD TEST</title>
<script type="text/javascript" src="script/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

	 inityear();

});
//初期化年度
function inityear () {
	var y = new Date().getFullYear();
	var start_y = y - 70;
	for (var i = start_y; i < (y+1); i++) {
		$("#syear")[0].options.add(new Option(i,i));
	}
}

//选了年之后才补充月份。如果年选择为空，那么月份，日分都为空
function changeyear () {
	var year = $("#syear").val();
	//清空月
	for (var i = 1; i < 13; i++) {
		$("#smonth option[value='"+i+"']").remove();
	}
	//得到日的最大值，清空日
	var maxdaylen = $("#sday option:last").val();
	for (i = 1; i < maxdaylen + 1; i++) {
		$("#sday option[value='"+i+"']").remove();
	}
	//如果选了年，加上月
	if (year != "") {
		for (var i = 1; i < 13; i++) {
			$("#smonth")[0].options.add(new Option(i,i));
		}
	}

}

//选了月才能有日
function changemonth () {
	var month = $("#smonth").val();
	var year = $("#syear").val();
	//还是先清空日
	var maxdaylen = $("#sday option:last").val();
	for (i = 1; i < maxdaylen + 1; i++) {
		$("#sday option[value='"+i+"']").remove();
	}

	//算日子，要看有没有闰年
	if (month != "" && year != "" ) {
		switch(month){
			case "1":
			case "3":
			case "5":
			case "7":
			case "8":
			case "10":
			case "12":total = 31;break;
			case "4":
			case "6":
			case "9":
			case "11":total = 30;break;
			case "2":
                if(IsPinYear(year)){
                    total = 29;
                }else{
                    total = 28;
                }
		    default:break;
		}        

		for (var i = 1; i < total + 1; i++) {
			$("#sday")[0].options.add(new Option(i,i));
		}
	}
}
//判断闰年
function IsPinYear(year){ 
	return(0 == year%4 && (year%100 !=0 || year%400 == 0));
}
</script>
</head>
<body>

	<table>
				<tr class="con_hr1">
					<td></td>
					<td class="line_bt p_l">
						<select name="syear" id="syear" οnchange="changeyear()">
							<option value=""> -  - </option>
						</select>
						年
						<select name="smonth" id="smonth" οnchange="changemonth()">
							<option value="">- -</option>
						</select>
						月
						<select name="sday" id="sday" >
							<option value="">- -</option>
						</select>
						日
						<DIV id = "birthday_error" class="errornote" ></DIV>
					</td>
				</tr>
				<tr>
					<td>
						PS
					</td>
					<td>
						1.年份默认值为从系统时间向前推70年。（如果需要改变，搜索变量start_y，这是起始年份）<br/>
						2.年月日是联动的，一定要先年，再月，再日。<br/>
						3.已经包含了闰年的情况<br/>
						4.一旦年份改变，月日都消失。需要重新输入<br/>
					</td>
				</tr>

</table>
</body>
<!-- InstanceEnd --></html>