小白求救！各位大神麻烦帮我看下这个select显示的内容为什么不变化
经过各位大神的指点，我对代码进行了修改，解决了月份和日期的显示问题。但是现在还有一个毛病没想明白，就是年份那一框不管选择哪一年，显示的都是请选择，我鼠标都戳爆了也没用，就像图上这样。
抓瞎中。。。跪求各位大神不吝赐教。（附上修改后的代码）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
//这个方法是点击年份下拉框后显示1900至今的所有年份
function GetYear() {
var yearNode = document.getElementById("year");
//要调用Date的方法，就必须创建其对象，不能直接用类名调用
var date = new Date();
//这里获取的是从1900年到现在的经过的年数
var year = date.getFullYear();
//alert(time);//测试代码
//要对之前的数据进行删除，否则会累加，不能对i进行变化，否则会无法全部删除
//在删除之前要先获取yearNode的子节点个数
var children = yearNode.childNodes;
//这里之前出错了，因为忘记加上.length了
for (var i = 2; i < children.length;) {
//alert(children.length);
yearNode.removeChild(children[i]);
}
//yearNode.length = 1;
//这里是将各个年份作为option添加进代表年份的select下拉框中
for (var i = 1900; i <= year; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
//option.value = i;
yearNode.appendChild(option);
}
}
//这个方法是年份下拉框的内容发生变化时会运行的内容
function ChooseYear() {
//月份
var monthNode = document.getElementById("month");
monthNode.length = 1;
for (var i = 1; i <= 12; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
option.value = i;
monthNode.appendChild(option);
}
}
function ChooseMonth() {
var yearNode = document.getElementById("year");
var monthNode = document.getElementById("month");
//日期
var dateNode = document.getElementById("date");
dateNode.length = 1;
if(monthNode.value == 1|| monthNode.value == 3|| monthNode.value == 5|| monthNode.value == 7|| monthNode.value == 8|| monthNode.value == 10|| monthNode.value == 12) {
for (var i = 1; i <= 31; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if (monthNode.value == 4|| monthNode.value == 6|| monthNode.value == 9|| monthNode.value == 11) {
for (var i = 1; i <= 30; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if(monthNode.value == 2&& yearNode.value%4 == 0) {
for (var i = 1; i <= 29; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if(monthNode.value == 2&& yearNode.value%4 != 0) {
for (var i = 1; i <= 28; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
}
}
</script>
</head>
<body>
<select id="year" onclick="GetYear()" onchange="ChooseYear()">
<option>请选择</option>
</select>年
<select id="month" onchange="ChooseMonth()">
<option>请选择</option>
</select>月
<select id="date">
<option>请选择</option>
</select>日
</body>
</html>
年份是没有问题的，问题出现在月的选择上，ChooseTime()这个方法中对月份中的option值进行了赋值，当你选择了月份后，执行了ChooseTime()这个方法，又重新对月份进行了赋值
因为你的原始程序错了，在select后面的编程也出现了错误
下拉列表支持多选项时，size的属性的值需要设置大于1.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
//这个方法是点击年份下拉框后显示1900至今的所有年份
window.onload = function GetYear() {
var yearNode = document.getElementById("year");
//要调用Date的方法，就必须创建其对象，不能直接用类名调用
var date = new Date();
//这里获取的是从1900年到现在的经过的年数
var year = date.getFullYear();
//alert(time);//测试代码
//要对之前的数据进行删除，否则会累加，不能对i进行变化，否则会无法全部删除
//在删除之前要先获取yearNode的子节点个数
var children = yearNode.childNodes;
//这里之前出错了，因为忘记加上.length了
for (var i = 2; i < children.length;) {
//alert(children.length);
yearNode.removeChild(children[i]);
}
//yearNode.length = 1;
//这里是将各个年份作为option添加进代表年份的select下拉框中
for (var i = 1900; i <= year; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
//option.value = i;
yearNode.appendChild(option);
}
//alert("i");
}
//这个方法是年份下拉框的内容发生变化时会运行的内容
function ChooseYear() {
//月份
var monthNode = document.getElementById("month");
monthNode.length = 1;
for (var i = 1; i <= 12; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
option.value = i;
monthNode.appendChild(option);
}
}
//当月份下拉框内容发生变化时这里会运行噢
function ChooseMonth() {
var yearNode = document.getElementById("year");
var monthNode = document.getElementById("month");
//日期
var dateNode = document.getElementById("date");
dateNode.length = 1;
//根据大小月和平闰年对日期下拉框添加不同元素
if(monthNode.value == 1|| monthNode.value == 3|| monthNode.value == 5|| monthNode.value == 7|| monthNode.value == 8|| monthNode.value == 10|| monthNode.value == 12) {
for (var i = 1; i <= 31; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if (monthNode.value == 4|| monthNode.value == 6|| monthNode.value == 9|| monthNode.value == 11) {
for (var i = 1; i <= 30; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if(monthNode.value == 2&& yearNode.value%4 == 0) {
for (var i = 1; i <= 29; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
} else if(monthNode.value == 2&& yearNode.value%4 != 0) {
for (var i = 1; i <= 28; i ++) {
var option = document.createElement("option");
option.innerHTML = i;
dateNode.appendChild(option);
}
}
}
</script>
</head>
<body>
<!--
注意：1.onclick在不同浏览器的处理方式不同，在chrome中，点击下拉框中的选项也会触发onclick，就等于一致重新加载，导致年份框中显示的内容始终是请选择
2.我尝试过将onclick变成onmousedown，但是结果在IEedge上不兼容，年份那一框只能添加一次，第二次再去点击就没有下拉框弹出了
处理方式：在页面加载时就将year添加进去，(window.onload)
-->
<select id="year" onchange="ChooseYear()">
<option>请选择</option>
</select>年
<select id="month" onchange="ChooseMonth()">
<option>请选择</option>
</select>月
<select id="date">
<option>请选择</option>
</select>日
</body>
</html>
经过大神指点，我找出了问题所在。
年份那一栏显示出bug主要还是浏览器兼容性问题，这个onclick事件在IE中点击下拉框只会触发一次，而在chrome中在点击下拉框中的选项时也会触发一次，就导致了年份无限循环加载，使得框里的内容一直是"请选择"，所以在chrome等浏览器中就没法选择年份了。
我还尝试过把onclick改成了onmousedown，这下在chrome里面年份倒是可以正常选择了，但是到了IEedge这儿又不兼容了，下拉框里的年份加载一次以后再去点击就不会弹出来了。
最后我放弃在select里面添加这个事件，直接在页面加载完毕就把年份也添加到下拉框里。(我还没学到jQuery，所以ready还不会用，这里只能先用window,onload了)
这次bug让我对浏览器兼容问题的认识加深了一点，之前没遇到过这样的问题，导致这次直接抓瞎，但这真的是一次很宝贵的经验，知道了一个新的bug起因，以后再出这种问题也能往这个方向去想了。
最后感谢为我答疑解惑的各位大神，在此奉上格子衫一件，霸王若干。区区薄礼，不成敬意。(滑稽)
