我有一个包含某些产品名称的下拉列表,如果用户选择特定产品并且我不想添加,我想显示另一个下拉列表(尺寸,S,M,L)到其他值(产品),因为它们没有尺寸
<label>Product:</label> <select name="product">
<option value="1">Paper</option>
<option value="2">Bags</option>
<option value="10">Backpacks</option>
<option value="3">something something</option>
<option value="4">some other thing</option>
<option value="20">brand bags</option>
</select>
<select name="size3">
<?php
if($_POST['product']=="10" || $_POST['product']=="20"){
echo "<option value=`1`>Small</option>".
"<option value=`2`>Medium</option>".
"<option value=`3`>Large.</option>";
}
?>
</select>
当涉及到输出时,保管箱实际上具有我想要的值,但这是在我选择了 THE 特定值并刷新页面之后
答案 0 :(得分:2)
在javascript的主选择上设置一个侦听器,然后隐藏或显示选择的大小 在将结果发送回后,您可以使用javascript做很多事情
let el = document.getElementsByName("product");
let target = document.getElementById("size3");
el[0].addEventListener("change",function(){
let choice = this.value;
if(choice == "20" || choice == "10"){
target.style.display="inline-block";
}else{
target.style.display="none";
}
});
<label>Product:</label>
<select name="product">
<option value="1">Paper</option>
<option value="2">Bags</option>
<option value="10">Backpacks</option>
<option value="3">something something</option>
<option value="4">some other thing</option>
<option value="20">brand bags</option>
</select>
<select name="size3" id="size3" style="display:none;">
<option value="1">Small</option>
<option value="2">Medium</option>
<option value="3">Large</option>
</select>