單擊按鈕時更改圖片

這似乎應該可以工作，但不會。我不確定問題出在哪裏 - 要麼我做錯了，要麼可能出現語法錯誤。我只是沒有做任何事情。我試圖讓按鈕被點擊時改變當前圖片。我是Javascript的初學者，所以請溫柔;）謝謝！單擊按鈕時更改圖片

<html> 
<script> 
function pictureChange() 
{ 
document.getElementById(theImage).src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"); 
} 
</script> 
<body> 
<img id="theImage" src="http://31.media.tumblr.com/18b5f8f0a00ad01e50f7ae2f513be52d/tumblr_msqcl4iwM01soh1p8o1_500.png"> 
<p><input type="button" id="theButton" value="click me!" onclick="pictureChange()"></p> 
</body> 
</html>

來源

2013-10-26 user2884447

這是你可以調試自己的東西。查看[JavaScript錯誤控制檯]（http://www.netmagazine.com/tutorials/javascript-debugging-beginners）並查看錯誤消息的內容。 – JJJ

你錯過了引號.getElementById('theImage')

function pictureChange() 
    { 
    document.getElementById('theImage').src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
    }

來源

2013-10-26 17:08:21 Roar

在該行的末尾添加"到getElementById論證和刪除)：

<script> 
    function pictureChange() 
    { 
      document.getElementById("theImage").src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
    } 
</script>

http://jsfiddle.net/cDd8J/ - 在這裏。有用。

theImage只是元素的id，而不是變量，所以你必須把它放在引號中。

來源

2013-10-26 17:08:43

有很多方法，你可以使用內聯屬性或使用id在script.Here的一個調用它try.Calling功能，

theButton.onclick = function pictureChange() 
{ 
    document.getElementById("theImage").src="http://31.media.tumblr.com/fca646cd8fe87906e605ad7e8d039903/tumblr_mmoz4fWT6U1soh1p8o1_500.png"; 
}

Demo

來源

2013-10-26 17:13:44

您可以使用內嵌HTML： <img src="img1.jpg" onclick="this.src='img2.jpg'">效果最好。

來源

2016-11-19 13:33:48 CoderKube

單擊按鈕時更改圖片

回答

相關問題