javascript在javascript運行後恢復爲默認值

我正在學習javascript，並且我們已經給出了從點擊按鈕更改段落圖像/顏色的任務。我的代碼有效，但我必須添加一個alert（）來阻止它顯示，因爲它一運行就會恢復爲默認圖像/顏色。javascript在javascript運行後恢復爲默認值

function changeImage() { 
 
    var myTag=document.getElementById("imageColour"); 
 
    myTag.src = "images/white.jpg"; 
 
    var x = document.getElementById("demo"); 
 
    x.style.color = "red"; 
 
    // Had to add this to see change 
 
    alert("Has reached changeImage()"); 
 
}

<html lang="en"> 
 
    <head> 
 
\t <meta charset="utf-8"/> 
 
\t <script type="text/javascript" src="script.js"></script> 
 
\t <title>Exercise 3</title> 
 
    </head> 
 
    <body> 
 
\t <h3>Exercise 3</h3> 
 
\t <img src="images/black.jpg" id="imageColour"/> 
 
\t <form> 
 
\t  <button type="submit" id="mySubmitButton">Change Colour</button> 
 
\t </form> 
 
\t <p id="demo">Click the button to change the colour of this paragraph.</p> 
 
    </body> 
 
</html> 
 
<!--javascript--> 
 
<script type="text/javascript"> 
 
    document.getElementById("mySubmitButton").addEventListener("click", changeImage); 
 
</script>

讚賞任何幫助。

來源

2015-01-03 Pamela Keogh

您正在提交表單。這會導致頁面重新加載並重置。

使用type="button"（也可以在完成時完全刪除表格）或在事件對象（changeImage的第一個參數）上調用preventDefault。

來源

2015-01-03 15:57:20 Quentin

謝謝昆汀。當你說使用type =「button」時，你的意思是代替type =「submit」。另外，如果我將preventDefault添加到我的函數中，我仍然可以使用表單嗎？ –

是的。是的，但沒有任何意義，因爲您沒有任何其他字段，也沒有提交任何地方的（不存在的）數據。 – Quentin

javascript在javascript運行後恢復爲默認值

回答

相關問題