0
我有以下選擇列表:如何選擇第一個選擇列表後才能調用/激活第二個選擇列表?
SELECT列表1:
<select name="productcolor" id="productcolor" onChange="GetAvailProductSizes();">
<option value=""><? echo $langdata['oneprodpage_selectcolor']; ?>...</option>
<? foreach ($thisproduct['availcolors'] as $color) { ?>
<option value="<? echo $color['id']; ?>"><? echo $color['name']; ?></option>
<? }; ?>
</select>
SELECT LIST 2:
<select name="productsize" id="productsize" style="width: 120px;">
<option value=""><? echo $langdata['oneprodpage_selectsize']; ?>...</option>
</select>
如果列表1中任何地方選擇的選項,說明2將是空的。這就像LIST 2取決於列表1.
這是這裏所進行的:
<script type="text/javascript"><!--
function GetAvailProductSizes() {
$('select#productsize option').remove();
$('select#productsize').append('<option value=""><? echo $langdata['oneprodpage_selectsize']; ?>...</option>');
var color = $('#productcolor').val();
if (color > 0) {
var availsizes;
var http_request = new XMLHttpRequest();
http_request.open("GET", '<? echo ROOT; ?>/autocompleteavailsizes/?productid=<? echo $thisproduct['id']; ?>&color=' + color, true);
http_request.send(null);
http_request.onreadystatechange = function() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
availsizes = eval("(" + http_request.responseText + ")");
for (var i = 0; i < availsizes.length; i++) {
$('select#productsize').append('<option value="' + availsizes[i].id + '">' + availsizes[i].name + '</option>');
};
} else {
alert("There was a problem with the URL.");
}
http_request = null;
}
};
};
}
//-->
</script>
現在,我想SELECT列表2被隱藏,直到SELECT列表1並沒有被感動。任何幫助請與PHP或jQuery。謝謝!
謝謝!很簡單的解決方案 – user1978483