我有一个下拉菜单,有两个选项
<select name="chs" value="" id = ""/>
<option value="">ICE Cream</option>
<option value="">Juice</option>
</select>
这就是我想要的:在第一页中你看到一个选择,有两个选项,如果你选择ICE奶油,另一个选择会出现不同的口味(巧克力,香草等),同样的果汁。
这就是我已经拥有的:
HTML:
<label>Choose Skin</label><br /><select name="na" value="" id = ""/>
<option value="">ICE Cream</option>
<option value="">Juice</option>
</select>
<select name="icecreamfla" value="" onchange="showSelect()" id = "framework"/>
<option id="jm">vanilla</option>
<option id = "wp">chocholate</option>
</select>
<input type="submit" name = "redirect" value="go" />
java脚本:
function showSelect()
{
var select = document.getElementById('skin');
if(select.value == "juice"){
alert('saeed khare!');
}
else{
var option = document.getElementById('icecreamfla');
option.style.display = 'inline';
}
}
option.style.display曾经是'none',然后我将其更改为inline。 如果任何人可以提供帮助请做。
答案 0 :(得分:1)
选择 Ice Cream 时,只有small demo {{3}}才会出现<select>
。
如果用户选择 Juice ,则应该很容易实现此操作以显示不同的<select>
。
修改:如果您想要所选的值,可以使用types.options[types.selectedIndex].text
在演示中使用变量来获取它。
答案 1 :(得分:0)
这是你想要的吗?
<script language='javascript'>
function showSelect()
{
var select = document.getElementById('skin').value;
if(select == "ICE Cream"){
var str="<select name='icecreamfla' value='' id = 'icecreamfla'/>"
+"<option id='jm'>vanilla</option>"+
"<option id ='wp'>chocholate</option> </select>";
document.getElementById("flavour").innerHTML=str;
}
}
<label>Choose Skin</label><br /><select name="na" value="" id = "skin" onchange="showSelect()">
<option value="ICE Cream">ICE Cream</option>
<option value="Juice">Juice</option>
</select>
<div id="flavour"></div>
<input type="submit" name = "redirect" value="go" />