阻止表單提交（javascript）

Question

我有一個帶有文本輸入的表單：

<form name="form1">
    <cfinput type="text" name="text1" id="text1" onChange="someFunc();">
</form>

我只希望它在某些情況下提交。 （我先運行一些錯誤檢查）

<script>
function someFunc() {
    if (1==2) {
    document.form1.submit();
} else {
            alert("Not submitting");
    }
</script>

問題是：即使警報觸發正常，不知何故，表單仍在提交（除了那個之外沒有其他提交語句！）。

非常感謝，如果有人能夠對此有所了解。 。 。

Answer 1

這種方法存在根本缺陷。 您當前正在告訴表單，當text1更改時，然后調用someFunc() 。 如果為true，請使用JavaScript提交表單。 如果不對，請繼續關注您的業務。 如果在文本輸入中按Enter鍵，表單仍會提交。 如果有一個單擊的提交按鈕，表單仍然會提交。

解決這個問題的基本方法是這樣的：

<form name="form1" onsubmit="return someFunc()">
    <input type="text" name="text1" id="text1">
</form>

提交from時，調用someFunc() 。 此函數必須返回true或false。 如果返回true，則表單提交。 如果為false，則表單不執行任何操作。

現在您的JavaScript需要稍作修改：

<script>
function someFunc() {
    if (1==2) {
        return true;
    } else {
        alert("Not submitting");
        return false;
    }
}
</script>

更改字段時，您仍可以調用其他函數，但它們仍然無法管理表單的最終提交。 實際上， someFunc()可以在返回true或false之前調用其他函數進行最終檢查，直到onsubmit事件。

編輯： 隱式表單提交的文檔。

編輯2：

這段代碼：

$(document).ready(function(){ 
    $("#text1").on('change', function(event){ 
        event.preventDefault(); 
    }); 
});

正在停止與該元素關聯的change事件的默認處理。 如果您想影響submit事件，那么您可以這樣做：

$(document).ready(function(){ 
    $("#form1").submit(function(event){ 
        event.preventDefault(); 
    }); 
});

這將允許你做這樣的事情：

$(document).ready(function(){ 
    $("#form1").submit(function(event){ 
        if ( $('#text1').val() !== "foo" ) {
            alert("Error");
            event.preventDefault(); 
        }
    }); 
});

Answer 2

 var form = document.getElementById("Your Form ID");

 form.addEventListener("submit", function (e) {
      if ("Your Desired Conditions.") {
          e.preventDefault();
      }
 });

Answer 3

使用以下代碼，它將完美地工作

<form onsubmit="return false;" >