Javascript简单的onclick图像交换

use*_*946 3 javascript

我正在尝试使用Javascript交换图像,到目前为止我可以从A到B,但不能回来.

以下是我用来创建一个交换的内容:

<img src="pic1.png" name="pic" onclick="window.document.pic.src='pic2.png';"/>
Run Code Online (Sandbox Code Playgroud)

这将图像1交换到图像2,足够简单.但是我希望能够通过点击新图像恢复到图像2.我尝试使用这个:

<img src="pic1.png" name="pic" onclick="
if (window.document.pic.src='pic1.png'){
window.document.pic.src='pic2.png';
} 
else if (window.document.pic.src='pic2.png'){
window.document.pic.src='pic1.png';
}"/>
Run Code Online (Sandbox Code Playgroud)

它在这种情况下似乎不起作用.它将切换到pic2,但不会切换回pic1.是否与onclick有关?我的if语句?谢谢

小智 11

尝试这个简单的技巧......易于维护.

<script>
var onImg= "on.jpg";
var offImg= "off.jpg";
</script>
<img src="on.jpg" onclick="this.src = this.src == offImg ? onImg : offImg;"/>
Run Code Online (Sandbox Code Playgroud)