改变的图像，并用JavaScript单击事件改回来

Question

我有以下代码：

window.onload = function() { 
'use strict'; 

var alcohol = document.getElementById('alcohol'); 

var changeImage = function (event) { 
    alcohol.src = "image/alcohol3.jpg"; 
}; 

var changeBack = function (event) { 
    alcohol.src = "image/alcohol.jpg"; 
}; 

addHandler(alcohol, "click", changeImage); 
// addHandler(alcohol, "mouseout", changeBack); 

我怎样才能改变形象背面采用了第二次点击事件？目前，这不起作用。

Answer 1

更改changeImage功能：

var changeImage = function (event) { 
    if (alcohol.src != "image/alcohol3.jpg"){ 
     alcohol.src = "image/alcohol3.jpg"; 
    } 
    else 
    { 
     alcohol.src = "image/alcohol.jpg"; 
    } 
}; 

Answer 2

您可以使用切换：

$("#alcohol").toggle(
    changeImage() , 
    changeBack() 
); 

Answer 3

你可以使用一个闭合状，这样做：

var changeImage = function() { 
    function a(event) { 
     alcohol.src = "image/alcohol3.jpg"; 
     event.srcElement.onclick = b; 
    } 
    function b(event) { 
     alcohol.src = "image/alcohol.jpg"; 
     event.srcElement.onclick = a; 
    } 
    return a; 
} 
addHandleaddHandler(alcohol, "click", changeImage()); 

首先，它是作为处理程序分配的a函数以及每个引发事件的处理程序是在a和b之间切换。