Question

所有图片立即显示。我试图尝试更改为3张图片中的1张，但所有图片仍然显示，我不确定我做错了什么，感谢您提前提供任何帮助

<!DOCTYPE html>
<html> 
<head> 
<title>Picture Change</title>
<meta charset="UTF-8" />
<link rel="stylesheet" type="text/css" href="picchange.css">
<script> 

function changeImage()
{
var img = document.getElementById("image");
img.src="tool1.jpg";
return false;
}

function changeImage2()
{
var img = document.getElementById("image2");
img.src="tool2.jpg";
return false;
}

function changeImage3()
{
var img = document.getElementById("image3");
img.src="tool3.jpg";
return false;
}
</script>

</head>
<body>
<img id="image" src="tool1.jpg">
<img id="image2" src="tool2.jpg">
<img id="image3" src="tool3.jpg">

<br><br><br>
<p><input type="button" id="image" value="tool1!" onclick="changeImage()"></p>
<p><input type="button" id="image2" value="tool2!" onclick="changeImage()"></p>
<p><input type="button" id="image3" value="tool3" onclick="changeImage()"></p>

</body>
</html>

Answer 1

这是你在找什么？ https://jsfiddle.net/wcqoLvt0/8/

HTML

<img src="" id="image" />
<br><br><br>
<p><input type="button" id="image" value="tool1" onclick="changeImage('http://placehold.it/100x100')"></p>
<p><input type="button" id="image2" value="tool2" onclick="changeImage('http://placehold.it/150x150')"></p>
<p><input type="button" id="image3" value="tool3" onclick="changeImage('http://placehold.it/200x200')"></p>

JS

function changeImage(arg) {
  var image = document.getElementById("image");
  image.src=arg;
}

使用按钮

1 个答案: