js中實現時間聯動

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
/**
 * @author Administrator
 */
//通過js創建年,月,日
//獲取Dom
var dom = window.document;
function myYear() {
	//獲取年的select
	var year = dom.getElementById("year");
	//創建年
	var minYear = 1900;
	var maxYear = new Date().getFullYear();
	for (var i = minYear; i <= maxYear; i++) {
		//創建Option
		var opt = dom.createElement("option");
		//設置Option,標籤體.
		opt.innerHTML = i;
		//opt.value = i;
		//掛載節點
		year.appendChild(opt);
	}
}
function myMonth() {
	var month = dom.getElementById("month");
	//創建月
	for (var i = 1; i <= 12; i++) {
		//創建Option
		var opt = dom.createElement("option");
		//設置Option,標籤體.
		if (i < 10) {
			opt.innerHTML = "0" + i;
			//opt.value = i;
		} else {
			opt.innerHTML = i;
			//opt.value = i;
		}
		month.appendChild(opt);
	}
	month.onchange = myDay;
}
function myDay() {
	clear();
	//創建天
	// 大月1 3 5 7 8 10 12 ,小月4 6 9 11    閏年2月 非閏年的2月
	//獲取年
	var year = dom.getElementById("year").value;
	//獲取月
	var month = dom.getElementById("month").value;
	if (year == "年") {
		alert("請選擇年");
		return;
	}
	if (month == "月") {
		alert("請選擇月");
		return;
	}
	//獲取天select
	var day = dom.getElementById("day");
	//一個月至少有28天.
	for (var i = 1; i <= 28; i++) {
		var opt = dom.createElement("option");
		if (i < 10) {
			opt.innerHTML = "0" + i;
			//opt.value = "0" + i;
		} else {
			opt.innerHTML = i;
			//opt.value = i;
		}
		day.appendChild(opt);
	}
	//大月
	var isBigMonth = month == 1 || month == 3 || month == 5 || month == 7 || month == 8 || month == 10 || month == 12;
	//小月
	var isSmallMonth = month == 4 || month == 6 || month == 9 || month == 11;
	//閏年    可以整除4但不能整除100 或者 年份可以整除400.
	var isLeapYear = (year % 4 == 0 && year % 100 != 0) || year % 400 == 0;
	//判斷,如果是大月,添加3天
	if (isBigMonth) {
		//添加3天
		for (var i = 29; i <= 31; i++) {
			var opt = dom.createElement("option");
			opt.innerHTML = i;
			//opt.value = i;
			day.appendChild(opt);
		}
	} else if (isSmallMonth) {
		//添加2天
		for (var i = 29; i <= 30; i++) {
			var opt = dom.createElement("option");
			opt.innerHTML = i;
			opt.value = i;
			day.appendChild(opt);
		}
	} else if (isLeapYear) {
		//如果是閏年,添加一天.專門處理閏年2月.
		var opt = dom.createElement("option");
		opt.innerHTML = 29;
		//opt.value = 29;
		day.appendChild(opt);
	}
}
function clear() {
	var day = dom.getElementById("day");
	var optArr = day.childNodes;
	for (var i = optArr.length - 1; i >= 0; i--) {
		day.removeChild(optArr[i]);
	}
}
/*function getBirthday() {
	//獲取Dom
	var dom = window.document;
	myYear();
	myMonth();
}
getBirthday();*/
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>javascript</title>
</head>
<body>
	生日:
		<select id="year" onFocus="myYear()">
			<option>年</option>
		</select>
		<select id="month" onFocus="myMonth()">
			<option>月</option>
		</select>
		<select id="day" onFocus="myDay">
			<option>日</option>
		</select>
	
</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章