考え方は >>3 と同じ。DOM1 の範囲で書いてみる。かえって面倒かもしれないが。
<form action="#">
<script type="text/javascript">
/**
* changeRange (form, value [[ name1, name2, ... ]]);
*
* -form: 対象にする form 要素ノード（HTMLFormElement）。
* -value: 09-12、13-16 のように、表示させたい時刻の範囲を - 区切りで指定した文字列（String）。
* -name1, name2, ...: 適用させたい select 要素名（String）。数は任意。
*/
function changeRange (form, value) {
var range = value.split ('-');
var i = 2;
var I = arguments.length;
while (i < I) {
var name = arguments[i++];
var select = form.elements[name];
while (select.hasChildNodes ()) select.removeChild (select.firstChild);
for (var j = range[0], J = range[1]; j <= J; j++) {
var option = document.createElement ('option');
option.value = j;
option.appendChild (document.createTextNode (j));
select.appendChild (option);
}
}
}
</script>
<p>
<label>
<input type="radio" name="ampm" value="09-12" checked onmouseup="changeRange (this.form, this.value, 'shh', 'ehh')">
午前
</label>
<label>
<input type="radio" name="ampm" value="13-16" onmouseup="changeRange (this.form, this.value, 'shh', 'ehh')">
午後
</label>
<select name="shh">
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
</select>
<select name="ehh">
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
</select>
</p>
</form>
なお、Firefox、Opera なら option 要素の disabled 属性がちゃんと効くから、以下で十分。
<style type="text/css">
option[disabled] { display: none; }
</style>
<script type="application/javascript">
function changeRange (form, value) {
var range = value.split ('-');
Array.forEach (Array.slice (arguments, 2), function (name) {
Array.forEach (form.elements[name].options, function (option) {
var n = parseInt (option.value, 10);
option.disabled = (n < range[0] || range[1] < n);
} );
} );
}
</script>
