JavaScript取消表單提交：

1、表單提交事件onsubmit，事件函式返回false時，可以取消表單的提交。

用法示例：onsubmit="return func();"或者form.onsubmit=function(){return false;}

<form id="login" class="form-horizontal" action="login_login.action" onsubmit="return validate();" method="post">

</form>

function validate(){
        alert("請輸入驗證碼！"); //則彈出請輸入驗證碼  
        return false;
    }
    else if(inputCode != code ) { 
        alert("驗證碼輸入錯誤！@
 
[email protected]"); //則彈出驗證碼輸入錯誤  
        createCode();//重新整理驗證碼  
        document.getElementById("verificatCode").value = "";//清空文字框  
        return false;
    }
    else {//輸入正確時 
        return true;
    }
}

在form表單中onsubmit的書寫一定是要"return 方法()",只寫"方法()"則不行。並且要有返回值，返回false，就會阻止提交，返回true，則不會。錯誤的寫法是:

<form id="login" class="form-horizontal" action="login_login.action" onsubmit=" return validate();" method="post">

</form>
 


在form表單中onsubmit的書寫一定是要"return 方法()",只寫"方法()"則不行。並且要有返回值，返回false，就會阻止提交，返回true，則不會。錯誤的寫法是:

<form id="login" class="form-horizontal" action="login_login.action" onsubmit="validate();" method="post">

</form>

2、通過提交按鈕的點選事件onclick屬性，事件函式返回false。

<form name="loginForm" action="login.aspx" method="post">
 <button type="submit" value="Submit" id="submit">Submit</button>
</form>
  
<script>
 var submitBtn = document.getElementById("submit");
  
 submitBtn.onclick = function (event) {
  alert("preventDefault!");
  return false;//此處return false;即不會提交表單，一般驗證表單資料不符合要求使用
 };
</script>
 

或者：

<form name="loginForm" action="login.aspx" method="post">
 <button type="submit" value="Submit" id="submit">Submit</button>
</form>
  
<script>
 var submitBtn = document.getElementById("submit");
  
 submitBtn.onclick = function (event) {
  alert("preventDefault!");
  var event = event || window.event;
  event.preventDefault(); // 相容標準瀏覽器
  window.event.returnValue = false; // 相容IE6~8
 };
</script>

或者jquery裡面的提交按鈕的click()點選事件返回false：

下拉列表<select>和<option>,選定的option的value值，即為select的值。select標籤沒有value屬性，所以option的值就是select的值。

    <select name="type" id="type" class="form-control" >
        <option value="0">--請選擇--</option>
        <option value="1">計算機</option>
        <option value="2">小說</option>
        <option value="3">雜項</option>
     </select>
        <input id="sub01" type="submit" value="增加圖書" class="btn btn-success"/>
    $("#sub01").click(function(){
        if($("#name").val() == null || $("#name").val() == ""){
            alert("圖書名不能為空");
            //window.history.back();
            return false;
        }
        if($("#author").val() == null || $("#author").val() == ""){
            alert("作者名不能為空");
            //window.history.back();
            return false;
        }
        if($("#time").val() == null || $("#time").val() == ""){
            alert("日期格式不正確");
            //window.history.back();
            return false;
        }
        if($("#type").val() == "0"){
            alert("請選擇書籍型別")
            //window.history.back();
            return false;
        }


    });     

jQuery取消表單提交：

1、通過表單提交的submit()函式。

$("form").submit( function () {
        return false;
    } );

綜上，就是通過表單提交事件和提交按鈕的點選事件，返回false來取消表單提交。