0

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

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

这是两个选择标签..

提前致谢，

阿米斯

4

3 回答 3

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; 
         }
  }
}
于 2013-10-21T07:14:18.543 回答
1

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

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

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

然后，如果它是真的，禁用它。否则，您必须启用它。如果您不重新启用它，那么如果用户再次更改“sel1”中的值，则之前在“sel2”中禁用的值将无法再次启用。

于 2013-10-21T07:18:23.317 回答
1

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

  }    
}
于 2013-10-21T09:27:21.697 回答