从一个选择标记中选择一个值后禁用选择值[关闭]

Question

i have two select option for time selecting if i would select one value say 9:00am from one select tag 9:00am should be disabled from other select tag code is

<select>
<option value="9:00am">9:00am</option>
<option value="10:00am">10:00am</option> </select> so on.



<select>
<option value="9:00am">9:00am</option>
<option value="10:00am">10:00am</option> </select> so on..

These are the two select tag ..

Thanks in Advance,

Ameeth

Answer 1

i think this may be what you're looking for

http://codepen.io/anon/pen/xegKj

html:

<select id="TimeFirst" onChange="fSetTimeOptions(this,'TimeSecond');">
  <option value="9:00am">9:00am</option>
  <option value="10:00am">10:00am</option>
</select>
<select id="TimeSecond" onChange="fSetTimeOptions(this,'TimeFirst');">
  <option value="9:00am">9:00am</option>
  <option value="10:00am">10:00am</option>
</select>

js:

function fSetTimeOptions(selObj, fvOtherSel) {
  var OtherSel = document.getElementById(fvOtherSel);
  var TimeValue = selObj.options[selObj.selectedIndex].value;
  alert(TimeValue);
  for (var i = 0; i < OtherSel.options.length; i++) {
         if (OtherSel.options[i].value == TimeValue) {
             OtherSel.options[i].disabled = true;
         } else {
             OtherSel.options[i].disabled = false; 
         }
  }
}