為什么以下代碼沒有按預期執行？

Question

<!DOCTYPE html>
<html>
<body>

<img id="image" src="smiley.gif" width="160" height="120">

<script>
function myFunction()
{
    var img = document.getElementById("image");
    if (img.src == "smiley.gif")

    document.getElementById("image").src="landscape.jpg";
    else
    document.getElementById("image").src="smiley.gif";
}
</script>
<button type="button" onclick = "myFunction()"> click me </button>
<p>The original image was smiley.gif, but the script changed it to landscape.jpg</p>

</body>
</html>

我希望每次用戶點擊按鈕時讓HTML頁面在兩張圖片之間切換，但圖片永遠不會改變。

當我改變了

if (img.src == "smiley.gif")

成

if (img.src.match("smiley.gif"))

然后代碼按預期工作。

誰能告訴我原因？

Answer 1

devnull69是對的。 如果將img的源設置為相對路徑，則它的src屬性仍將返回完整的URL。 您需要完全限定圖像的路徑或將img.src值剝離到最終組件（文件名）並進行比較。

例如，您可以這樣做：

var imgFilename = img.src.substring(img.src.lastIndexOf("/") + 1);
if (imgFilename === "smiley.gif") {
    // Do something.
}

為什么以下代碼沒有按預期執行？

問題描述

1 個解決方案

解決方案1
2 已采納 2014-04-10 13:15:33

為什么以下代碼沒有按預期執行？

問題描述

1 個解決方案

解決方案1 2 已采納 2014-04-10 13:15:33

解決方案1
2 已采納 2014-04-10 13:15:33