一、jQuery Form簡介
jQuery Form插件是一個優秀的Ajax表單插件，可以非常容易地、無侵入地升級HTML表單以支持Ajax。jQuery Form有兩個核心方法 -- ajaxForm() 和 ajaxSubmit()， 它們集合了從控制表單元素到決定如何管理提交進程的功能。另外，插件還包括其他的一些方法： formToArray()、formSerialize()、fieldSerialize()、fieldValue()、clearForm()、clearFields() 和 resetForm()等。
jQuery Form Plugin 能夠讓你簡潔的將以HTML形式提交的表單升級成采用AJAX技術提交的表單。
插件里面主要的方法, ajaxForm 和 ajaxSubmit, 能夠從form組件里采集信息確定如何處理表單的提交過程。兩個方法都支持眾多的可選參數，能夠讓你對表單里數據的提交做到完全的控制。這讓采用AJAX方式提交一個表單的過程簡單的不能再簡單了！
二、下載地址
下載地址： http://malsup.com/jquery/form/#download
Github主頁： https://github.com/malsup/form
網盤下載：https://yunpan.cn/crjzfmXqaTu9e 訪問密碼 e3bc
三、資料
中文在線文檔：http://www.vaikan.com/docs/jquery.form.plugin/jquery.form.plugin.html
英文在線文檔：http://jquery.malsup.com/form/
四、簡單的體驗例子
1. 在你的頁面里寫一個表單。一個普通的表單，不需要任何特殊的標記：
<form id="myForm" action="comment.jsp" method="post"> Name: <input type="text" name="name" /> Comment: <textarea name="comment"></textarea> <input type="submit" value="Submit Comment" /> </form>
2. 引入jQuery和Form Plugin Javascript腳本文件並且添加幾句簡單的代碼讓頁面在DOM加載完成后初始化表單：
<script src="jquery-1.3.1.js" type="text/javascript"></script> <script src="jquery.form.js" type="text/javascript"></script>
或是通過CDN：
<script src="http://malsup.github.io/jquery.form.js" type="text/javascript"></script>
<script src="//oss.maxcdn.com/jquery.form/3.50/jquery.form.min.js"></script>
<script src="http://malsup.github.io/min/jquery.form.min.js"></script>
然后編寫頁面：
<form id="myForm" action="demo.jsp" method="post"> 名稱： <input type="text" name="name" /> <br/> 地址： <input type="text" name="address" /><br/> 自我介紹： <textarea name="comment"></textarea> <br/> <input type="submit" id="test" value="提交" /> <br/> <div id="output1" style="display:none;"></div> </form>
3. 當表單提交后name ，address 和 comment的值就會被提交給demo.jsp. 如果服務器端返回成功的狀態，用戶將會看到一句提示信息 "Thank you" 。
詳細代碼如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>demo1.html</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script src="jquery-1.3.1.js" type="text/javascript"></script> <script src="jquery.form.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('#myForm').ajaxForm(function() { $('#output1').html("提交成功！歡迎下次再來！").show(); }); }); </script> </head> <body> <h3> Demo 1 : form插件的使用--ajaxForm(). </h3> <form id="myForm" action="demo.jsp" method="post"> 名稱： <input type="text" name="name" /> <br/> 地址： <input type="text" name="address" /><br/> 自我介紹： <textarea name="comment"></textarea> <br/> <input type="submit" id="test" value="提交" /> <br/> <div id="output1" style="display:none;"></div> </form> </body> </html>
其他關聯教程：
jQuery Form 表單提交插件----Form 簡介，官方文檔，官方下載地址
jQuery Form 表單提交插件-----ajaxForm() 的應用
jQuery Form 表單提交插件-----ajaxSubmit() 的應用
jQuery Form 表單提交插件-----ajaxForm() 的應用
jQuery Form 表單提交插件-----ajaxSubmit() 的應用
jQuery Form 表單提交插件-----formSerialize，fieldSerialize，fieldValue，resetForm，clearForm，clearFields的 應用
jQuery form插件的使用--ajaxForm()和ajaxSubmit()的可選參數項對象
jQuery form插件的使用--用 formData 參數校驗表單，驗證后提交（簡單驗證）.
jQuery form插件的使用--使用 fieldValue 方法校驗表單
jQuery form插件的使用--處理server返回的JSON， XML，HTML數據