如何在提交時導航禁用html表單？

Question

可以說我有這種形式

<form onsubmit="submitData();">
    <input type="text" pattern="^[A-z]+$" required>
    <button type="submit">OK</button>
</form>

單擊提交按鈕后，我不希望表單在地址欄中發布任何數據或導航到任何地方，我只是希望它運行submitData函數，就是這樣。 我想使用表單的原因是因為它的驗證功能（如果輸入文本丟失或與模式不匹配，它不會讓你提交）。

如果我將窗體上onsubmit的值切換為“return false;” 那么它不會導航但是“submitData（）;返回false;” 不起作用。 還有其他想法嗎？

Answer 1

嘗試添加e.preventDefault(); 在代碼的開頭，將事件傳遞給function submitData(e) { ，如下所示：

function submitData(e) {
    e.preventDefault();
    ...
}

請參閱： https ： //developer.mozilla.org/en/docs/Web/API/Event/preventDefault

Answer 2

只需將表單自動傳遞的event.preventDefault添加到函數中：

function submitData(event){
   event.preventDefault();    
   //your code will be here
}

閱讀更多： https ： //developer.mozilla.org/en/docs/Web/API/Event/preventDefault

Answer 3

使用event.preventDefault() 。

了解更多信息： https ： //developer.mozilla.org/en/docs/Web/API/Event/preventDefault

Answer 4

將此添加到您的代碼中：

document.getElementById("addYourTagHERE").addEventListener("onsubmit", function(event){
        event.preventDefault()
    });

或者你的功能：

function submitData(event) {
    event.preventDefault();

}

Answer 5

您想要取消提交event處理程序的默認操作 ，因此：

function submitData() {
    // whatever logic you have...
    return false;
}

我相信這也有效：

function submitData( e ) {
    e.preventDefault();
    // whatever logic you have...
}