Раскрывающийся список выбора месяца в HTML и JavaScript
У меня есть 2 выпадающих в HTML, представляющих месяцы. Поэтому я хочу подтверждение, как следующее.
Если я выберу первый выпадающий месяц как апрель, то следующее выпадающее меню должно начаться с апреля. Если первый изменится на июнь, то второй должен измениться на июнь.
<div id="head2" style="width:15%;float:right;margin-left:5px;">
<select id='gMonth2' onchange="show_month()">
<option value=''>--Select Month--</option>
<option selected value='1'>Janaury</option>
<option value='2'>February</option>
<option value='3'>March</option>
<option value='4'>April</option>
<option value='5'>May</option>
<option value='6'>June</option>
<option value='7'>July</option>
<option value='8'>August</option>
<option value='9'>September</option>
<option value='10'>October</option>
<option value='11'>November</option>
<option value='12'>December</option>
</select>
</div>
<div id="head1" style="width:15%;float:right;margin-left:5px;">
<select id='gMonth1'>
<option value=''>--Select Month--</option>
<option selected value='1'>Janaury</option>
<option value='2'>February</option>
<option value='3'>March</option>
<option value='4'>April</option>
<option value='5'>May</option>
<option value='6'>June</option>
<option value='7'>July</option>
<option value='8'>August</option>
<option value='9'>September</option>
<option value='10'>October</option>
<option value='11'>November</option>
<option value='12'>December</option>
</select>
</div>
Функция будет:
function show_month()
{
//
}
Как мне написать эту функцию?
Ответы
Ответ 1
Легко с jQuery:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script>
$(function(){
$('#gMonth2').change(function(){
var month = $(this).val();
$('#gMonth1').val(month);
});
});
</script>
и пропустите событие onChange в первом выборе...
Рабочий пример здесь: http://jsfiddle.net/sCnEZ/1/
Ответ 2
Ваша JS-функция может быть такой:
function show_month(obj) {
document.getElementById('gMonth1').selectedIndex = obj.selectedIndex;
}
Вы должны изменить onchange="show_month()"
на onchange="show_month(this)"
Отъезд jsfiddle