SRC圖片更換點擊使用JavaScript

Question

後，我在我的html頁面有這樣的形象：

<img src="/images/deactivate.png" onclick="act_deact(this);"/> 

，並在我的javascript代碼，我有這樣的：

function act_deact(image) { 
    image.src = (image.src=="/images/activate.png") ? "/images/deactivate.png" : "/images/activate.png"; 
} 

，當我點擊圖片上最初停用它激活，但在第二次點擊它不會停用！

有沒有問題與我的代碼？

從JS業餘:)

Answer 1

我找到了解決自己：對，我已經嘗試@ fardjad正在尋找url中的字符串並提出條件

我分享解決方案:)

function act_deact(image) { 
if(image.src.indexOf('deactivate') != -1) 
    image.src="/images/activate.png"; 
else 
    image.src="/images/deactivate.png"; 
} 

@ hjpotter92：上image.alt與檢查條件的解決方案使用：

HTML：

<img alt="deactivate" src="/images/deactivate.png" onClick="act_deact(this);" /> 

JS的功能：

function act_deact(image) { 
    if (image.alt=="activate") { 
     image.src = "/images/deactivate.png"; 
     image.alt = "deactivate"           } 
    else { 
     image.src = "/images/activate.png"; 
     image.alt = "activate" 
    } 
} 

感謝您的答覆:)

Answer 2

這是因爲當你將其設置爲（或者它改變）/images/activate.png首先點擊的src屬性不再只是/images/activate.png但這樣做的與服務器地址前綴。

您可以點擊此處查看：http://jsfiddle.net/hGcqq/

還是你自己的服務器上，使用console.log或alert如果你喜歡。

Answer 3

@hjpotter92已經explained它不起作用的原因。

的一種方式，使其工作是檢查是否SRC與/images/activate.png結束：

var activateURL = '/images/activate.png'; 
if (img.src.substring(img.src.length - activateURL.length) !== activateURL) { 
    image.src = '/images/activate.png'; 
} else { 
    image.src = '/images/deactivate.png'; 
} 

Answer 4

的image.src包含了規範的路徑，即使初始化使用相對路徑。您可以使用完整路徑中的條件類似

function act_deact(image) { 
    image.src = (image.src=="FULL-PATH-OF-IMAGE") ? "/images/deactivate.png" : "images/activate.png"; 
} 

（以獲得完整的路徑一個可以使用alert（image.src）;）

，或者，如果所有的圖像具有唯一的名稱

function act_deact(image) { 
    image.src = image.src.match(/activate.png$/) ? "/images/deactivate.png" : "images/activate.png"; 
} 

Answer 5

的第一件事是括號它應該是這樣的：

image.src = (image.src=="/images/activate.png" ? "/images/deactivate.png" : "/images/activate.png") 

也可以嘗試image.getAttribute（ 「SRC」）和image.setAttribute（「src」）而不是image.src。

請試試這個代碼：

function act_deact(image) { 
    image.setAttribute("src", (image.getAttribute("src")=="/images/activate.png" ? "/images/deactivate.png" : "/images/activate.png")) 
} 

編輯：其他的答案告訴你的絕對和相對URL的問題，這樣的getAttribute將解決這個問題。我不建議在這裏使用RegExp或子字符串。

Answer 6

，使其與相對URL工作，你可以簡單地保存當前的URL是這樣的：

var newsrc = "/images/deactivate.png"; 
function act_deact(image) { 
    if (newsrc == "/images/deactivate.png") { 
    image.src = "/images/activate.png"; 
    newsrc = "/images/activate.png"; 
    } 
    else { 
    image.src = "/images/deactivate.png"; 
    newsrc = "/images/deactivate.png"; 
    } 
} 

然後調用它

<img src="/images/deactivate.png" onclick="act_deact(this);"/>