jQuery核心库文件：jquery-1.8.2.js
jquery form 库文件：jquery.form.js
html代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>jquery-form Demo</title> <!-- 需要导入的就jQuery类库 --> <script type="text/javascript" src="js/jquery-1.8.2.js"></script> <script type="text/javascript" src="js/jquery.form.js"></script> <!-- JS文件 --> <script type="text/javascript" src="index.js"></script> </head> <body> <form action="" id="myForm" method="post"> <table border="1" width="70%"> <tr> <td>姓名：</td> <td> <input type="text" name="name" id="name" /> </td> </tr> <tr> <td>性别：</td> <td> <input type="radio" name="gender" value="m" checked="checked" />男 <input type="radio" name="gender" value="f" />女 </td> </tr> <tr> <td colspan="2"> <input type="submit" id="submit" value="提交" /> <input type="button" id="test" value="重置" /> <!-- id=reset不可以 --> <input type="button" id="clear" value="清除" /> </td> </tr> </table> </form> <div id=result></div> </body> </html>
js代码
$(document).ready(function() { // 参数设置 var options = { target : "#result", url : "index.jsp", type : "post", // dataType:"json", resetForm : true, beforeSubmit : validate, success : process // clearForm:true, // timeout:3000 }; // 提交 $("#myForm").ajaxForm(options); // 提交前（可以用来验证表单） function validate(formData, jqForm, options) { // 取得得表单元素 var name = formData[0].value; // var name=jqForm[0].name.value; if (name == "") { alert("请输入姓名"); $("#name").focus(); return false; } // 取得参数 var param = $("#myForm").formSerialize(); // var param = $.param(formData); alert(param); return true; } // 提交后（取得返回信息，比如:操作成功） function process(data, status) { alert("返回的数据：" + data); alert("状态：" + status); // success } // 重置 $("#test").click(function() { $("#myForm").resetForm(); }); // 清除 $("#clear").click(function() { $("#myForm").clearForm(); }); });
java代码
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <% String name = request.getParameter("name"); String gender = request.getParameter("gender"); String str = "name="+name+",gender="+gender; System.out.println(str); out.println("操作成功"); %>