JavaScript 生日下拉

来源：互联网发布：java查看内存使用情况编辑：程序博客网时间：2024/06/05 06:00

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>生日选择</title>
<script>
//给”年“的下拉菜单添加数据
function addYear(count) {
var now = new Date();
var nowYear = now.getFullYear();
var objSelectYear = document.getElementById("selYear");
for(i = 0; i < count; i++) {
objSelectYear.innerHTML += "<option value='" + (nowYear - i) + "'>" + (nowYear - i) + "年</option>";
}
}

var arrMonth = new Array("一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "冬月", "腊月");

//给”月“的下拉菜单添加数据
function addMonth() {
var objSelectYear = document.getElementById("selYear");
var objSelectMonth = document.getElementById("selMonth");
objSelectMonth.length = 1;
var objSelectDate = document.getElementById("selDate");
objSelectDate.length = 1;
if(objSelectYear.selectedIndex > 0) {
for(i = 0; i < arrMonth.length; i++) {
objSelectMonth.innerHTML += "<option value='" + i + "'>" + arrMonth[i] + "</option>";
}
}
}

//给”日“的下拉菜单添加数据
function addDate() {
var maxDate;
var objSelectDate = document.getElementById("selDate");
objSelectDate.length = 1;

var objSelectYear = document.getElementById("selYear");
var objSelectMonth = document.getElementById("selMonth");

switch(objSelectMonth.selectedIndex) {
case 2:
var index = objSelectYear.selectedIndex;
// alert(objSelectYear[index].textContent);//获取option对象显示的文本
// alert(objSelectYear[index].value);//获取option对象的value值
var nowYear = parseInt(objSelectYear[index].value);
if(nowYear % 400 == 0 || (nowYear % 100 != 0 && nowYear % 4 == 0)) { //判断闰年
maxDate = 29;
} else {
maxDate = 28;
}
break;
case 4:
case 6:
case 9:
case 11:
maxDate = 30;
break;
case 1:
case 3:
case 5:
case 7:
case 8:
case 10:
case 12:
maxDate = 31;
break;
}

for(i = 1; i <= maxDate; i++) {
objSelectDate.innerHTML += "<option value='" + i + "'>" + i + "</option>";
}
}
</script>
</head>

<body onload="addYear(50);">
<select id="selYear" onchange="addMonth();">
<option>-- 年 --</option>
</select>
<select id="selMonth" onchange="addDate();">
<option>-- 月 --</option>
</select>
<select id="selDate">
<option>-- 日 --</option>
</select>
</body>

</html>

0 0