前幾天在學習form表單提交時看到這兩種方法，這兩種方法都是實現form的ajax提交的方法，看了很多資料還是不太明白其用法和區別，最后直接自己寫demo，很快就理解，所以說實操是學習的最快捷直接的途徑。好了，下面回到正題：

在使用這兩種方法之前，首先需要安裝form.js的插件，下載就不放了，網上一搜就有；

<script src="/Tool/HtmlPage/S45/js/jquery-form.js"></script>

一、首先說用法，ajaxForm和ajaxSubmit都可以接收0或1個參數，該參數可以是一個變量、一個對象或回調函數，這個對象主要有以下參數：

var object= {url:url,　　　　　　//form提交數據的地址type:type,　　　? //form提交的方式(method:post/get)target:target,　　//服務器返回的響應數據顯示的元素(Id)號beforeSerialize:function(){} //序列化提交數據之前的回調函數beforeSubmit:function(){},　　//提交前執行的回調函數success:function(){},　　　　?? //提交成功后執行的回調函數error:function(){},???????????? //提交失敗執行的函數dataType:null,　　　　　　　//服務器返回數據類型clearForm:true,　　　　　　 //提交成功后是否清空表單中的字段值restForm:true,　　　　　　? //提交成功后是否重置表單中的字段值，即恢復到頁面加載時的狀態timeout:6000 　　　　　 　 //設置請求時間，超過該時間后，自動退出請求，單位(毫秒)。　　}

html代碼：

<form action="" id="persondetail" method="post"> <div>姓名：<input name="text1" type="text" class="inputbox"></div> <div>年齡：<input name="text2" type="text" class="inputbox"></div> <div>愛好：<input name="text3" type="text" class="inputbox"></div> <div><input id="submitbtn" type="submit" value="提交"></div> </form>

JS代碼：

//ajaxForm $(function(){$("form").ajaxForm(object)； })//ajaxSubmit $(function(){$('#submitbtn').click(function(){$("form").ajaxSubmit(object)；}) })

參數也可以為一個回調函數

$(function(){$('#submitbtn').click(function(){$("form").ajaxSubmit(function(data){alert(data);})})})

二、再說這兩種方法的區別

這兩種方法主要的卻別是ajaxForm不能主動提交form，函數只是為提交表單做準備需要以submit來觸發提交。而ajaxSubmit會主動提交表單，同時可以在點擊其他按鈕時也可以觸發提交，不一定是submit按鈕。

ajaxForm執行的時候其實相當于

?$("form").submit(function(){
??????????? $(this).ajaxSubmit();

??????????? return false;??????? //此句解釋了為什么ajaxSubmit會自動提交表單，想要阻止自動提交，必須return false；
})

總結

以上是生活随笔為你收集整理的ajaxForm和ajaxSubmit实现form的ajax提交的方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。