使用javascript控制多選框使用單個選擇框

Question

`<select multiple="multiple" name="state[]" id="state"> 
<option value="">Select a State</option> 
<?php 
foreach($state_list as $key=>$value){ 
echo "<option value=\"$key\""; 
if($html['state']==$key|| $row['state']==$key){ 
echo ' selected="selected"'; 
} 
echo ">$value</option>\n";          
}?> 
</select> </p>` 


<p>Select A Country 
<select name="country" id="country"> 
<option value="0">Select a Country</option> 
<option value="USA">USA</option>        
<option value="UK">UK</option>  
</select> </p> 

我有兩個選擇框1）狀態[] 2）國家。需要的是，「如果所選國家不是美國，請禁用包含美國所有州的多選框」。任何幫助表示讚賞

Answer 1

你可以做到以下幾點，如果您有jQuery的：

$('#country').change(function() { 
    if($('#country').val() != "USA") { 
     $('#state').attr('disabled', 'disabled'); 
    } 
    else { 
     $('#state').removeAttr('disabled'); 
    } 
}); 

或者，如果您使用的是普通的JavaScript：

var elem = document.getElementById("country"); 
elem.onchange = function() { 
    if(elem.options[e.selectedIndex].value != "USA") { 
     document.getElementById('state').disabled = "disabled"; 
    } 
    else { 
     document.getElementById('state').removeAttribute("disabled"); 
    } 
} 

這將禁用狀態組合框時國組合框包含的值不是「美國」。當選擇的國家是「美國」時，它將刪除禁用的屬性並使其再次可用。

希望這會有所幫助。

Answer 2

添加此Javascript到你的代碼：

<script type="text/javascript"> 
<!-- 
window.onload = function() { 
    var selectCountry = document.getElementById('country'); 
    selectCountry.onchange = function() { 
     document.getElementById('state').disabled = (selectCountry.value != 'USA')? true : false; 
    }; 
}; 
//--> 
</script>