<!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>
js中實現時間聯動
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.