使用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>