Form Plugin API 里提供了很多有用的方法可以讓你輕松的處理表單里的數據和表單的提交過程。
測試環境：部署到Tomcat中的web項目。
一、ajaxSubmit() 介紹
立即通過AJAX方式提交表單。最常見的用法是對用戶提交表單的動作進行響應時調用它。
ajaxForm 需要零個或一個參數。唯一的一個參數可以是一個回調函數或者是一個可選參數對象。
是否可以連環調用: 是。
二、引入依賴的js
<script src="jquery-1.3.1.js" type="text/javascript"></script> <script src="jquery.form.js" type="text/javascript"></script>
網盤下載：https://yunpan.cn/crjzfmXqaTu9e 訪問密碼 e3bc
三、編寫頁面
<h3> Demo 2 : form插件的使用---ajaxSubmit(). </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>
四、調用ajaxSubmit() 的方法
<script type="text/javascript"> $(document).ready(function() { $('#myForm').submit(function() { $(this).ajaxSubmit(function() { $('#output1').html("提交成功！歡迎下次再來！").show(); }); return false; //阻止表單默認提交 }); }); </script>
五、詳細代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>jQuery form插件的使用---ajaxSubmit()</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').submit(function() {
$(this).ajaxSubmit(function() {
$('#output1').html("提交成功！歡迎下次再來！").show();
});
return false; //阻止表單默認提交
});
});
</script>
</head>
<body>
<h3> Demo 2 : form插件的使用---ajaxSubmit(). </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>
六、效果如下
