我在使用带有JavaScript的单选按钮隐藏/显示图像时遇到问题。我想做的是,在加载页面时,默认情况下仅显示第一张图像,而隐藏第二张图像。然后,用户可以选择在单击单选按钮时显示或隐藏哪一个。
这是我到目前为止所做的摘要。
<input type="radio" name="img1" onclick="img(0)" checked>Image 1
<input type="radio" name="img2" onclick="img(1)">Image 2
<div id="img1">
<!-- insert image -->
</div>
<div id="img2">
<!-- insert image -->
</div>
<script>
function img(x){
if(x==0){
document.getElementById('img2').style.display='none';
document.getElementById('img1').style.display='block';
}
else{
document.getElementById('img1').style.display='none';
document.getElementById('img2').style.display='block';
}
return;
}
</script>
这里的问题是,在加载页面后,将显示两个图像。单击第一张图像的单选按钮后,第二张图像将被隐藏,反之亦然。另外,checked属性不起作用。
最佳答案
您可以将默认设置为不显示
<div id="img2" style="display:none;">
<!-- insert image -->
</div>
关于javascript - Javascript:如何使用单选按钮在两个div之间显示/隐藏?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58743991/