下拉列表中的第一个选项得到修复，尽管我使用 javascript 将其设置为不显示
我正在尝试填充下拉列表的所有值并使用类来区分它当用户选择男人时他应该只得到 class=b1 同样适用于所有它但第一个选项始终保持选中状态我错过了诡计 !!帮助我的 friend
我在这里只使用 HTML CSS 和 Javascript ..
<html>
<head>
<script type="text/javascript">
function get(id)
{
if(id==1)
{
var divsb1 = document.getElementsByClassName('b1');
for(var i=0; i<divsb1.length; i++) {
divsb1[i].style.display='block'
}
var divsb2 = document.getElementsByClassName('b2');
for(var i=0; i<divsb2.length; i++) {
divsb2[i].style.display='none'
}
var divsb3 = document.getElementsByClassName('b3');
for(var i=0; i<divsb3.length; i++) {
divsb3[i].style.display='none'
}
}
else if(id==2)
{
var divsb2 = document.getElementsByClassName('b1');
for(var i=0; i<divsb2.length; i++) {
divsb2[i].style.display='none';
}
var divsb1 = document.getElementsByClassName('b2');
for(var i=0; i<divsb1.length; i++) {
divsb1[i].style.display='block'
}
var divsb3 = document.getElementsByClassName('b3');
for(var i=0; i<divsb3.length; i++) {
divsb3[i].style.display='none';
}
}
else if(id==3)
{
var divsb1 = document.getElementsByClassName('b3');
for(var i=0; i<divsb1.length; i++) {
divsb1[i].style.display='block'
}
var divsb2 = document.getElementsByClassName('b2');
for(var i=0; i<divsb2.length; i++) {
divsb2[i].style.display='none'
}
var divsb3 = document.getElementsByClassName('b1');
for(var i=0; i<divsb3.length; i++) {
divsb3[i].style.display='none'
}
}
} //end of function
</script>
</head>
<body>
<label class="alt-label">
<input type="radio" id="adserve" value="1" name="server_for" onclick="get(1)" />Men
</label>
<label class="alt-label">
<input type="radio" id="adserve" value="2" name="server_for" onclick="get(2)" />Women
</label>
<label class="alt-label">
<input type="radio" id="adserve" value="3" name="server_for" onclick="get(3)" />Kids
</label>
<select name="brands" id="brands">
<option class="b1" value="100">T-Shirts</option>
<option class="b1" value="12">Accessories & Combo Sets</option>
<option class="b2" value="23">Lingerie & Sleepwear</option>
<option class="b2" value="24">Accessories</option>
<option class="b3" value="27">Boys Wear</option>
<option class="b3" value="28">Girls Wear</option>
</select>
</body>
</html>
最佳答案
无法使用 CSS 隐藏选择选项。您可以做的是根据复选框选择禁用它们。
启用:
divsb1[i].disabled =false;
禁用:
divsb1[i].disabled =true;
关于javascript - 尽管我使用 javascript 将其设置为不显示，但下拉列表中的第一个选项得到了修复，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22786687/