我有两个多选框,一个用于国家/地区列表,另一个用于状态列表
<select multiple="multiple" name="country[]" id="country" >
<option value="0">Select a Country</option>
<?php
foreach($country_list as $key=>$value){
echo "<option value=\"$key\"";
if($html['Country Name']==$key|| $row['Country Name']==$key){
echo ' selected="selected"';
}
echo ">$value</option>\n";
}?>
</select>
<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>
我有这个javascript,当选择的国家是美国时启用状态框。
window.onload = function() {
var selectCountry = document.getElementById('country');
selectCountry.onchange = function() {
document.getElementById('state').disabled = (selectCountry.value != 'USA')? true : false;
};
};
但是,我希望在第一个国家/地区选择其他国家/地区时禁用状态框。 有什么建议吗?谢谢
答案 0 :(得分:1)
$("#country").on("click change", function(){
var option_usa = $("option[value=6]", this);
if (option_usa.is(":selected") && option_usa.siblings(":selected").length == 0) {
$("#state").removeAttr("disabled");
}
else {
$("#state").attr("disabled", "disabled");
}
});
我希望你能正确理解。
答案 1 :(得分:1)
这可以使用JQuery完成。
$("#state").hide();
$("#country").change( function () {
var countryName = $("#country").find("option:selected").html();
if(countryName == 'USA'){
$("#state").show();
} else {
$("#state").hide();
}
});
以下是JSFIDDLE
的链接