2012-01-16 3 views
1

나는 배 선택과 양식을 가지고있다.자바 스크립트 및 양식 선택의 관계

'cenaod'

<select class="form" name="cenaod" id="cenaod"> 
    <option value="0">Dowolna</option> 
    <option value="1000">1000</option> 
    <option value="2000">2000</option> 
    <option value="3000">3000</option> 
    <option value="4000">4000</option> 
    <option value="5000">5000</option> 
    <option value="6000">6000</option> 
</select> 

'cenado'

<select class="form" name="cenado" id="cenado"> 
    <option value="0">Dowolna</option> 
    <option value="1000">1000</option> 
    <option value="2000">2000</option> 
    <option value="3000">3000</option> 
    <option value="4000">4000</option> 
    <option value="5000">5000</option> 
    <option value="6000">6000</option> 
</select> 

및 JS 기능

function formPola(jeden,dwa) 
{ 
    document.getElementById(jeden).onchange = function(){ 
    var opt,pole,i; 
    opt = document.getElementById(dwa).getElementsByTagName('option'); 
    for(i=0; pole = opt[i]; i++){ 
    pole.style.display=""; 
    if(i < this.selectedIndex) 
    pole.style.display="none"; 
    } 
    } 
} 
formPola("cenaod","cenado"); 

내가 'cenaod'전에서 선택합니다. 4000, 'cenado'에서 내가 유일한 옵션 평등하고 더 큰 것 : 4000, 5000 및 파이어 폭스에서

6000은 완벽하게 작동하지만, IE와 오페라에서 작업니까.

답변

2

DEMO

당신은 없음으로 그 표시를 설정하여 옵션을 숨길 수 없습니다. 옵션을 표시하지 않으려면 드롭 다운에서 옵션을 제거해야합니다.

먼저 cenaod DD에서 모든 옵션을 저장 한 다음 cenaod가 변경되면 cenado를 지우고 새 cenaod 값보다 큰 (이전에 저장 한) 옵션 만 사용하여 다시 채우는 것이 좋습니다.

var cenado = document.getElementById("cenado"); 
var cenadoOptions = []; 
for (var i = 0, len = cenado.options.length; i < len; i++) 
    cenadoOptions.push(cenado.options[i]); 

var cenaod = document.getElementById("cenaod"); 
cenaod.onchange = function() { 
    var val = +cenaod.value; 
    cenado.options.length = 0; 
    for (var i = 0; i < cenadoOptions.length; i++) 
     if (+cenadoOptions[i].value >= val) 
      cenado.options.add(cenadoOptions[i]); 
}