[英]How to select an option in a dropdown list based on a selection in another dropdown list
[英]How can i change the one particular dropdown option according to another dropdown option selection?
我有两个平行的下拉列表,这是第一个
<select onchange="selchng1(1,this.id)" id="first1" name="sesion[]" class="tx_bx">
<option select="selected" value="select1">- Select -</option>
<option value="14275">Session #1: Tues May 31st - Fri June 10th (1-5:30PM)</option>
<option value="14276">Session #2: Tues June 14th - Fri June 24th (9-2:00PM)</option>
<option value="14277">Session #3: Tues June 28th - Fri July 8th (9-2:00PM)</option>
<option value="14278">Session #4: Tues July 12th - Fri July 22nd (9-2:00PM)</option>
</select>
第二个是
<select onchange="selchng1(1,this.id)" id="first_time1" name="time[]" class="tx_bx"><option select="selected" value="select2">- Select -</option>
<option value="14270">#1 only: 1pm</option>
<option value="14271">#1 only: 1:30pm</option>
<option value="14272">#1 only: 2pm</option>
<option value="14273">#1 only: 2:30pm</option>
<option value="14313">#1 only: 3:30pm</option>
<option value="14314">#1 only: 4pm</option>
</select>
现在我需要做的是
从第一个下拉菜单第一个选项中选择<option value="14275">Session #1: Tues May 31st - Fri June 10th (1-5:30PM)</option>
我需要从第二个下拉列表中显示前三个选项。
<option value="14270">#1 only: 1pm</option>
<option value="14271">#1 only: 1:30pm</option>
<option value="14272">#1 only: 2pm</option>
然后对于第一个选择框中的其余选项,
<option value="14275">Session #1: Tues May 31st - Fri June 10th (1-5:30PM)</option>
<option value="14276">Session #2: Tues June 14th - Fri June 24th (9-2:00PM)</option>
<option value="14277">Session #3: Tues June 28th - Fri July 8th (9-2:00PM)</option>
<option value="14278">Session #4: Tues July 12th - Fri July 22nd (9-2:00PM)</option>
我需要显示第二个选择框中的剩余选项,
<option value="14273">#1 only: 2:30pm</option>
<option value="14313">#1 only: 3:30pm</option>
<option value="14314">#1 only: 4pm</option>
我该怎么办?请给我建议。
//This stores the options
var options=[
["14270", "#1 only: 1pm"],
["14271", "#1 only: 1:30pm"],
...
["14314","#1 only: 4pm"]
];
//This is the index first1 -> first_time1
var index=[
[],
[0,1,2],
[3,4,5],
[3,4,5],
[3,4,5]
];
function update_first_time1(selidx) {
//Get select box options collection
var o=document.getElementById('first_time1');
if (!o) return false;
if (!o.options) return false;
o=o.options;
//Empty options
while (o.length>0) o[o.length-1]=null;
//Get the index of options to add
var a=index[selidx];
//Add these options
for (var i=0; i<a.lenght; i++)
o[o.length]=new Option(options[i][1], options[i][0]);
//done!
}
//First select box: hook onchange
<select onchange="selchng1(1,this.id); update_first_time1(this.selectedIndex)" id="first1" name="sesion[]" class="tx_bx">
...
</select>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.