2013-10-21 219 views
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.. 

這些都是提前兩個選擇標籤..

感謝,

Ameeth

+0

而你的方法來解決這個問題看起來像......? – feeela

+0

檢查此[小提琴](http://jsfiddle.net/dZqEu/2/) –

+0

感謝普通珍妮這是我正在尋找.. – user2610240

回答

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

它的工作我還有另一個問題,如我們可以禁用從選定的頂級值包括選擇,只有底部值必須使選定的 – user2610240

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

你必須找到在其他選項中選擇使用的電流值進行選擇:

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

然後如果這是真的,禁用它。否則,你必須啓用它。 如果您不啓用它,那麼如果用戶在「sel1」中再次更改該值,則不能再次啓用先前在「sel2」中禁用的值。

+0

它的工作我有另一個問題,像我們可以禁用值頂級值從選擇包括選定的和唯一的底部值必須作出選擇 – user2610240

+0

檢查我已添加的新答案 –

+0

感謝prabakaran它正在工作 – user2610240

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

如果條件內。

代碼:

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

    }  
}