div id="test" を、javascript を使用して選択したドロップダウン オプションの値に変更しようとしています。私はjsfiddleを開始しました。ユーザーが 2013 を選択すると、div id="test" が div id="2013" に変わり、月の 2 番目のドロップダウンが表示されます。年ドロップダウンの値は、最終的にその年に記録された実際の月をデータベースに照会するために使用されますが、今のところ、div id を変更し、後で使用するために値を保存することに興味があります。
<div class="report_select" id="style_container_div">
<label>Year:</label>
<select size="1" id="year" title="" type="select" name="style">
<option value="">Select Year</option>
<option value="2011">2011</option>
<option value="2012">2012</option>
<option value="2013">2013</option>
</select>
<div class="clear"></div>
<div id="error-message-style"></div>
</div>
<div id="test" class="style-sub-1" style="display: none;" name="stylesub1" onchange="ChangeDropdowns(this.value)">
<label>Select a Month:</label>
<select>
<option value=""></option>
<option value="January">January</option>
<option value="February">February</option>
<option value="March">March</option>
<option value="April">April</option>
<option value="May">May</option>
<option value="June">June</option>
<option value="July">July</option>
<option value="August">August</option>
<option value="September">September</option>
<option value="October">October</option>
<option value="November">November</option>
<option value="December">December</option>
</select>
</div>
<script type="text/javascript">
$("#year").change(function () {
var targID = $(this).val();
$("div.style-sub-1").hide();
$('#' + targID).show();
})
$("div.style-sub-1 select").change ( function () {
$("div.style-sub-2").hide ();
document.getElementById("test").setAttribute("id", targID);
$('#' + targID).show ();
} )
</script>