Question

我有两个时间选择选项，如果我选择一个值，说一个选择标签上午9:00应该从其他选择标签代码禁用9:00 am

<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..

这是两个选择标签..

先谢谢，

Ameeth

Answer 1

我认为这可能是你正在寻找的东西

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; 
         }
  }
}

Answer 2

HTML代码：

<select id="sel1" onchange="disableSelect(this);">
<option value="9:00am">9:00am</option>
<option value="10:00am">10:00am</option> </select>

<select id="sel2">
<option value="9:00am">9:00am</option>
<option value="10:00am">10:00am</option> </select>

Javascript：

function disableSelect(content) {
  var val = content.value;
  var mySel = document.getElementById("sel2");

  for (var i = 0; i < mySel.options.length; i++) { 

    if (mySel.options[i].value == val) {
      mySel.options[i].disabled=true;
    }
    else {
      mySel.options[i].disabled=false;
    }
  } 
}

您必须使用当前选择的值在另一个选项中找到该选项：

if (mySel.options[i].value == val) {
    mySel.options[i].disabled=true;
}

如果是，则禁用它。否则，你必须启用它。如果您没有启用它，那么如果用户在“sel1”中再次更改该值，则无法再次启用先前在“sel2”中禁用的值。

Answer 3

在if条件中添加两个内部for循环以禁用先前的值并删除else部分。

我添加了这个

   for(var j=i;j>=0;j--) {
        mySel.options[j].disabled=true;
     }
     for(j=i+1;j<mySel.options.length; j++) {
        mySel.options[j].disabled=false;
     }

在if条件中

。

代码：

for (var i = 0; i < mySel.options.length; i++) { 

  if (mySel.options[i].value == val) {
    mySel.options[i].disabled=true;

     for(var j=i;j>=0;j--) {
        mySel.options[j].disabled=true;
     }
     for(j=i+1;j<mySel.options.length; j++) {
        mySel.options[j].disabled=false;
     }

  }    
}

从一个选择标记中选择一个值后禁用选择值

3 个答案: