Question

所以，我是html的新手并说我有两个名为“Show Picture 1”和“Show Picture 2”的按钮

我希望能够在单击“显示图片1”按钮后显示Picture1。

我还希望能够显示Picture2所在的Picture2（如果正在显示Picture1，则隐藏Picture1）。

为了让这种情况发生，我应该编写什么代码？

到目前为止我的代码显示图片1：

<style type="text/css">
.show{display:block;}
.hide{display:none;}
</style>
<script type="text/javascript">
function showImg()
{
var obj=document.getElementById('Picture1');
obj.className = 'show';
}
</script>



<center>
<img id="Picture1" src=Picture1.jpg" class="hide">
<input type="button" onclick = "showImg()" value= "Picture1">
</center>

由于

Answer 1

///如果您想要切换图像，请尝试使用这个简单的代码////

<script type = "text/javascript">
        function pic1()
        {
            document.getElementById("img").src = "picture 1 source";
        }
        function pic2()
        {
            document.getElementById("img").src ="picture 2 source";
        } </script>





    <img src = "" id = "img"/> <input type="button" value="Show Picture
    1" onclick="pic1()"/> <input type="button" value="Show Picture 2"
    onclick="pic2()"/>

html点击按钮显示/隐藏图片？

1 个答案: