Javascript 从月份下拉选项显示当前月份的DIV

我有个月的降幅（1月至12月）。选择月份时，它将显示该月份的DIV。默认情况下，将显示当前月份和相应的DIV

到目前为止，默认情况下我可以在下拉列表中显示当前月份，但我不知道为什么不显示相应的DIV

此外，当选择一月时，DIV将显示，但当选择另一个月时，DIV不会消失。这只是一月的情况

HTML

<select name="month" id="month">
  <option value="0">January</option>
  <option value="1">February</option>
  <option value="2">March</option>
  <option value="3">April</option>
  <option value="4">May</option>
  <option value="5">June</option>
  <option value="6">July</option>
  <option value="7">August</option>
  <option value="8">September</option>
  <option value="9">October</option>
  <option value="10">November</option>
  <option value="11">December</option>
</select>

<div class="hide" id="0">Jan content</div>
<div class="hide" id="1">Feb content</div>
<div class="hide" id="2">Mar content</div>
<div class="hide" id="3">Apr content</div>
<div class="hide" id="4">May content</div>
<div class="hide" id="5">Jun content</div>
<div class="hide" id="6">Jul content</div>
<div class="hide" id="7">Aug content</div>
<div class="hide" id="8">Sept content</div>
<div class="hide" id="9">Oct content</div>
<div class="hide" id="10">Nov content</div>
<div class="hide" id="11">Dec content</div>

JavaScript+jQuery

var CurrentDate=new Date();
$("#month").val(CurrentDate.getMonth());

document.getElementById('month').onchange = function() {
    var i = 1;
    var myDiv = document.getElementById(i);
    while(myDiv) {
        myDiv.style.display = 'none';
        myDiv = document.getElementById(++i);
    }
    document.getElementById(this.value).style.display = 'block';
};

演示：

---

谢谢大家!

我想你真的很接近。看看下面的代码。我修改了一些东西

具体而言，

var i=0和初始显示


var CurrentDate=新日期（）；
$（“#月”）.val（CurrentDate.getMonth（））；
document.getElementById（新日期（）.getMonth（））.style.display='block'；
document.getElementById（'month'）。onchange=function（）{
var i=0；
var myDiv=document.getElementById（i）；
while（myDiv）{
myDiv.style.display='none'；
myDiv=document.getElementById（++i）；
}
document.getElementById（this.value）.style.display='block'；
};
.hide{
显示：无；
}

一月
二月
前进
四月
也许
六月
七月
八月
九月
十月
十一月
十二月
简内容
二月含量
Mar内容
四月含量
可以满足
六月内容
七月含量
八月内容
九月内容
Oct内容
十一月内容
12月内容
我想你真的很接近了。看看下面的代码。我修改了一些东西

具体而言，
var i=0和初始显示


var CurrentDate=新日期（）；
$（“#月”）.val（CurrentDate.getMonth（））；
document.getElementById（新日期（）.getMonth（））.style.display='block'；
document.getElementById（'month'）。onchange=function（）{
var i=0；
var myDiv=document.getElementById（i）；
while（myDiv）{
myDiv.style.display='none'；
myDiv=document.getElementById（++i）；
}
document.getElementById（this.value）.style.display='block'；
};
.hide{
显示：无；
}

一月
二月
前进
四月
也许
六月
七月
八月
九月
十月
十一月
十二月
简内容
二月含量
Mar内容
四月含量
可以满足
六月内容
七月含量
八月内容
九月内容
Oct内容
十一月内容
12月内容
您没有显示当月的内容，请查看此内容，这可能会对您有所帮助


var CurrentDate=新日期（）；
var curMonth=CurrentDate.getMonth（）；
document.getElementById（curMonth.style.display='block'；
$（“#月”）.val（CurrentDate.getMonth（））；
document.getElementById（'month'）。onchange=function（）{
var i=1；
var myDiv=document.getElementById（i）；
while（myDiv）{
myDiv.style.display='none'；
myDiv=document.getElementById（++i）；
}
document.getElementById（this.value）.style.display='block'；
};
.hide{
显示：无；
}

一月
二月
前进
四月
也许
六月
七月
八月
九月
十月
十一月
十二月
简内容
二月含量
Mar内容
四月含量
可以满足
六月内容
七月含量
八月内容
九月内容
Oct内容
十一月内容
12月内容
您没有显示当月的内容，请查看此内容，这可能会对您有所帮助


var CurrentDate=新日期（）；
var curMonth=CurrentDate.getMonth（）；
document.getElementById（curMonth.style.display='block'；
$（“#月”）.val（CurrentDate.getMonth（））；
document.getElementById（'month'）。onchange=function（）{
var i=1；
var myDiv=document.getElementById（i）；
while（myDiv）{
myDiv.style.display='none'；
myDiv=document.getElementById（++i）；
}
document.getElementById（this.value）.style.display='block'；
};
.hide{
显示：无；
}

一月
二月
前进
四月
也许
六月
七月
八月
九月
十月
十一月
十二月
简内容
二月含量
Mar内容
四月含量
可以满足
六月内容
七月含量
八月内容
九月内容
Oct内容
十一月内容
Dec内容
我对你的js代码做了一些修改，试试这个

var CurrentDate=new Date();
var curMnth = CurrentDate.getMonth();
$("#month").val(curMnth);
$("#"+curMnth).show();

document.getElementById('month').onchange = function() {
    var i = 0;
    var myDiv = document.getElementById(i);
    while(myDiv) {
        myDiv.style.display = 'none';
        myDiv = document.getElementById(++i);
    }
    document.getElementById(this.value).style.display = 'block';
};

它将解决这个问题。
我对您的js代码做了一些更改，试试这个

var CurrentDate=new Date();
var curMnth = CurrentDate.getMonth();
$("#month").val(curMnth);
$("#"+curMnth).show();

document.getElementById('month').onchange = function() {
    var i = 0;
    var myDiv = document.getElementById(i);
    while(myDiv) {
        myDiv.style.display = 'none';
        myDiv = document.getElementById(++i);
    }
    document.getElementById(this.value).style.display = 'block';
};

它将解决这个问题。
只是一个注释，但HTML 4及以下版本不支持以数字开头的ID。这可能不适用于较旧的浏览器。HTML5规范打开了这个窗口。只是一个注释，但HTML4及以下版本不支持以数字开头的ID。这可能不适用于较旧的浏览器。HTML5规范打开了这个。很高兴听到。祝你好运，很高兴听到。祝你好运