仅当单击按钮时显示图像

2024-01-07

刚刚开始学习 HTML 和 Javascript。 我有以下代码,它有效。但是,因为我的身体中有一个 img 标签,所以在单击按钮之前它会尝试显示图像的占位符。我怎样才能阻止这个。

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Tesco JSONP</title>

    <script type="text/javascript">

        function picture(){ 
        var pic = "http://img.tesco.com/Groceries/pi/118/5000175411118/IDShot_90x90.jpg"
        document.getElementById('bigpic').src = pic.replace('90x90', '225x225');

        }


    </script>


</head>

<body>


        <img id="bigpic" src="bigpic" />

    <button onclick="picture()">Enlarge</button>

</body>

</html>

最好的祝愿。


为图片标签添加样式“display:none”

<img id="bigpic" src="bigpic" style="display:none;"/>

并在功能图片中将其更改为显示图像

document.getElementById('bigpic').style.display='block';

有演示:http://jsfiddle.net/eX5kx/ http://jsfiddle.net/eX5kx/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

仅当单击按钮时显示图像 的相关文章

随机推荐