三级联动

最新推荐文章于 2021-12-15 09:28:08 发布

DaZhangWei1

最新推荐文章于 2021-12-15 09:28:08 发布

阅读量102

点赞数

文章标签：三级联动

本文链接：https://blog.csdn.net/weixin_44017261/article/details/89418582

版权

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
		<script src="js/jquery.js"></script>
		<title></title>
	</head>
	<body>
		<div class="container">
			<div class="form form-inline">
				<div class="form-group">
					<label for="name">出生年月日：</label>
					<select class="form-control year"></select> - 年
					<select class="form-control moth"></select> - 月
					<select class="form-control day"></select> - 日
				</div>
			</div>
		</div>
		<script>
			$(function(){
				var day31 = [1,3,5,7,8,10,12];
				var day30 = [4,6,8,10];
				for(var i = 1990; i<=2019;i++){
					$('.year')[0].add(new Option(i,i));
				};
				for(var i = 1; i<=12; i++){
					$('.moth')[0].add(new Option(i,i));
				};
				for(var i = 1;i <= 31;i++){
					$('.day')[0].add(new Option(i,i));
				};
				$('.moth').change(function(){
					getDay();
				});
				$('.year').change(function(){
					getDay();
				})
				
				function getDay(){
					$('.day').empty();
					if(day31.indexOf(parseInt($('.moth').val())) !=-1){
						for(var i = 1;i <= 31;i++){
							$('.day')[0].add(new Option(i,i));
						};
					}else if(day30.indexOf(parseInt($('.moth').val()))!= -1){
						for(var i = 1;i <= 30;i++){
							$('.day')[0].add(new Option(i,i));
						};
					}else{
						if(parseInt($('.year').val()) % 4 == 0 && parseInt($('.year').val()) % 100 != 0 || parseInt($('.year').val()) % 400 == 0){
							for(var i = 1;i <= 29;i++){
								$('.day')[0].add(new Option(i,i));
							};
						}else{
							for(var i = 1;i <= 28;i++){
								$('.day')[0].add(new Option(i,i));
							};
						}
					}
				}
			})	
		</script>
	</body>
</html>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<form action="" name="myForm">
			<p>
				<select name="year"></select>年
				<select name="moth"></select>月
				<select name="day"></select>日
			</p>
		</form>
		<script type="text/javascript">
			var year = document.forms.myForm.year;
			var moth = document.forms.myForm.moth;
			var day = document.forms.myForm.day;
			var day31 = [1,3,5,7,8,10,12];
			var day30 = [4,6,9,11];
			for(var i = 1900;i <= 2019; i++){
				year.add(new Option(i,i));
//				var opt = document.createElement('option') 
//				opt.value = i;
//				opt.innerHTML = i;
//				year.appendChild(opt)
			}
			for(var i = 1;i <= 12; i++){
				moth.add(new Option(i,i));
			}
			for(var i = 1;i <= 31; i++){
				day.add(new Option(i,i));
			}
			moth.onchange = createDay
			year.onchange = createDay
			function createDay(){
				day.length = 0;
				if(day31.indexOf(parseInt(moth.value))!= -1){ // 判断是否是13578 10 12月份的
					setDay(31)
				}else if(day30.indexOf(parseInt(moth.value))!= -1){ // 判断是否是4 6  9 11月份的
					setDay(30)
				}else{ // 处理2月份的
					if(year.value % 4 == 0 && year.value % 100 != 0 || year.value % 400 == 0){				//平年28天				闰年29天
						//能被4整除的     并且	不能被100整除的都是闰年  或者	能被400整除的也是闰年
						setDay(29)
					}else{
						setDay(28)
					}
				} 
			}
			function setDay(num){
				for (var i = 1;i <= num;i++){
					day.add(new Option(i,i))
				}
			}
		</script>
	</body>
</html>