onclick第二次點擊

Question

不知道這是否可能保持代碼簡單，但即時嘗試使它成爲我有一個圖像，當你點擊它，它會去一個新的形象。那麼當你點擊那個圖像時，它會回到原始圖像。 我的代碼是：

function save_data() 
{ 
if (document.images.save.src == "saved.png") document.images.save.src="save.png"; 
if (document.images.save.src == "save.png") document.images.save.src="saved.png"; 
} 


<img id="save" onclick="save_data()" src="save.png"> 

Answer 1

它可以被簡化。

使用

<img id="save" onclick="save_data(this)" src="save.png">` 

你可以做

function save_data(img) 
{ 
    img.src = /saved/i.test(img.src) ? 'save.png' : 'saved.png'; 
} 

如果這不起作用，它可能與事實saved.png是不是在HTML中的路徑做。所以，嘗試一個完整的網址：

function save_data(img) 
{ 
    var imgpath = 'http://yoursite.com/imgpath/'; 
    img.src = imgpath + (/saved/i.test(img.src) ? 'save.png' : 'saved.png'); 
} 

注意：它可能會更好地分配點擊處理程序unobtrusively（也見SO question）

Answer 2

if (document.images.save.src == "saved.png") - 這是行不通的，因爲.src返回完整的圖像的路徑，而不僅僅是文件名。例如，http://site.com/path/images/saved.png。

嘗試匹配子字符串。

function save_data() 
{ 
if (document.images.save.src.indexOf("saved.png") != -1) document.images.save.src="save.png"; 
if (document.images.save.src.indexOf("save.png") != -1) document.images.save.src="saved.png"; 
}