Onclick和Onload之間的不同行爲

Question

我有一個索引網頁，上面有一個提交按鈕。當我點擊那個按鈕時，我想運行一個函數，將一個字符串添加到div（使用onclick（））。但是，它只閃爍然後消失。但是，當我使用window.onload時，它仍然保留在頁面上，就像我打算的那樣。代碼如下：

<div> 
    <form> 
    <input type="submit" onclick="test();" value="Add Text"> 
    </form> 
    <div id="holder"></div> 
</div> 

我在頁面中加入了一個「腳本」標籤。

時，我用這個，它停留在頁面上（因爲它應該）：

window.onload = function(){ 
    $('#holder').html("Hello <b>world</b>!"); 
} 

但這消失加載之後：

function test(){ 
    $('#holder').html("Hello <b>world</b>!"); 
} 

謝謝！

Answer 1

您使用的按鈕是一個表單提交按鈕，它將提交表單並重新加載頁面。

而是使用一個<button>按鈕

使用

<button onclick="test();">Add Text</button> 

代替

<form> 
    <input type="submit" onclick="test();" value="Add Text"> 
    </form>