仅在单击按钮时显示图像 [英] display an image only when button is clicked
本文介绍了仅在单击按钮时显示图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有下面的代码,它的工作原理。然而,因为我的身体里有一个img标签,所以我试图在点击按钮之前显示图片的占位符。
<!DOCTYPE HTML>
< html>
< head>
< meta http-equiv =Content-Typecontent =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 =bigpicsrc =bigpic/>
< button onclick =picture()>放大< / button>
< / body>
< / html>
祝好。
解决方案
=bigpicstyle =display:none;/>
然后在函数图片中将它改为显示图片
的document.getElementById( 'bigpic')的style.display = '块'。
有演示: http://jsfiddle.net/eX5kx/
Just beginning to learn HTML & Javascript. I have the following code, which works. however, because I have have an img tag in my body it is trying to show a place holder for an image before I click the button. How can I stop this.
<!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>
Best wishes.
解决方案
Add style "display:none" to picture tag
<img id="bigpic" src="bigpic" style="display:none;"/>
And in function picture change it for show image
document.getElementById('bigpic').style.display='block';
There is demo: http://jsfiddle.net/eX5kx/
这篇关于仅在单击按钮时显示图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文