我想单击一个图像并将 IMAGE 更改为我文件夹中的另一个图像,但这不起作用,所以我选择了一个按钮,但这也没有达到我想要的效果。当我使用 onclick 时,图像不会改变。这是一个元素,不接受嵌入的JS代码,所以我们必须把它放在一个单独的文件中。
HTML:
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<br>
<div class="logo">
<img src="logo.png" width="270" height="240">
</div>
<script src="functions.js"></script>
<link rel="stylesheet" type="text/css" href="shirt.css">
</head>
<body>
<br>
<div class="scrollmenu">
<nav class="navbar">
<a href="shirt.html">Home</a>
<a href="Shop.html">Shop</a>
<a href="discounts.html">Discounts</a>
<a href="feedback.html">Feedback</a>
</div>
</nav>
</header>
<br>
<div class="t1">
<h2 class="heading">CUSTOMISE YOUR SHIRT..</h2>
<div class="customT1">
<img id="IMAGE" src="t1.png" width="540" height="540"/><p>€10.00</p>
<p>Select one of the designs from below..</p>
<img src="drift.png" width="140" height="140" border="2";/>
<img src="clutch.png" width="140" height="140" border="2"/>
<img src="jdm.png" width="130" height="140" border="2"/>
<img src="twosik.png" width="140" height="140" border="2"/>
</br>
<button class="button" type="button" onclick= "alert();">USE</button>
</div>
</div>
<br>
<footer>
<p>@Liam Chambers 2016</p>
</footer>
</body>
enter code here
</html>
JS:
<script type ="text/javascript">
function alert(){
alert("hi");
document.getElementById("IMAGE").src = "t1drift.png";
}
</script>
最佳答案
试试这个
<button onclick="document.getElementById('IMAGE').src='t1drift.png'">USE</button>
关于javascript - Onclick 图像没有改变,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40692685/