表單在javascript中重置

Question

我正在嘗試用確認窗口重置窗體。我的HTML看起來像：

<input type="reset" value="Reset" onclick="showReset();"/> 

然後我的javascript：

function doReset() { 
    var formElements = document1.form1.elements; 
    for (var i = 0; i < formElements.length; i++) { 
     formElements[i].value = ""; 
     if (formElements[i].checked) { 
      formElements[i].checked = false; 
     } 
    } 
} 

function showReset() { 
    if (window.confirm("Do you really want to reset the form?")) { 
     doReset(); 
    } 
} 

當我擊取消確認窗口，形式仍然被重置，我不知道爲什麼。謝謝。

Answer 1

如果我理解這個問題，關鍵是要繞過默認行爲，並使用您的函數來代替。您可以通過向showReset（）函數添加返回false來防止默認按鈕操作。

function showReset(e) { 
    if (window.confirm("Do you really want to reset the form?")) { 
     doReset(); 
    } 
    return false; 
} 

此外，確保onclick處理程序返回showReset結果：

<input type="reset" value="Reset" onclick="return showReset();"/> 

另外，如果你想默認瀏覽器的行爲，只是想要一個確認對話框，爲什麼不能只用一個確認？像這樣：

<input type="reset" value="Reset" onclick="return window.confirm('Do you really want to reset the form?');"/> 

這僅僅是一個「做什麼」，但如果你想獲得更多的信息，還有在這些線程一些好的信息：

• event.preventDefault() vs. return false
• What's the effect of adding 'return false' to a click event listener?

Answer 2

由於您的輸入類型已重置，它仍會重置。作出這樣的按鈕或東西，只是使用形式的復位方法，像這樣：

document.form1.reset(); 

MDN Docs

Answer 3

另一種方法：

var r=confirm("Do you really want to reset the form?"); 
if(r==true){ 
//Reset logic 
}else{ 
//Dont reset logic 
}