jQuery异步提交表单（有实例）

####前言：

我们在开发的时候，一定会使用ajax异步提交表单，在这里总结一下：

####前提准备：引入脚本

####前台页面：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



    
    
    
    
    

    
    

    




    姓名：

    年龄：


    性别：男  女 


    



       
    
 
 

      

####后台servlet代码：

package cn.cupcat.controller;

import java.io.IOException;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class TestAJAXContorller extends HttpServlet{

	/**
	 * 
	 */
	private static final long serialVersionUID = 1L;

	@Override
	protected void doGet(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		System.out.println("进入了doGet方法！");
		//调用都doPost方法，get和post做同样处理
		doPost(req, resp);
		
	}

	@Override
	protected void doPost(HttpServletRequest req, HttpServletResponse resp)
			throws ServletException, IOException {
		System.out.println("进入了doPost方法！");
		
		//设置请求编码
		req.setCharacterEncoding("UTF-8");
		//设置响应编码
		resp.setCharacterEncoding("UTF-8");
		
		//得到表单中的name
		String name = req.getParameter("name");
		//得到表单中的age
		String age = req.getParameter("age");
		//得到表单中的sex
		String sex = req.getParameter("sex");
		//输出打印
		System.out.println("name = "+name + " age = " + age +" sex = "+sex);
		
		String message = "name = "+name + " age = " + age +" sex = "+sex;
		
		//返回客户端结果
		String result = getResponseResult(200,message);
		
		//将result返回客户端
		resp.getWriter().print(result);
		
		//这里可以不用关闭 resp.getWriter()流，由容器负责管理
		
	}
	//这里为了简单，没有引入处理json的包，这是模拟json数据
	public static String getResponseResult(int status,String message){
			
		return  "{status: "+status+",message: '"+message+"'}";
	}
	

}

####web.xml配置

  upload_demo
  
  
  
  		testAjax
  		cn.cupcat.controller.TestAJAXContorller
  
  
  		testAjax
  		/testAjax
  
  
  

  
  
    index.html
    index.htm
    index.jsp
    default.html
    default.htm
    default.jsp
  

####注意：

ajaxSubmit({})的也可以这样设置表单的method、action、表单项

 type: 'post', // 提交方式 get/post
 url: 'your url', // 需要提交的 url
  data: {
        'title': title,
        'content': content
   },
  success: function(data) { // data 保存提交后返回的数据，一般为 json 数据
   // 此处可对 data 作相关处理
                alert('提交成功！');
 }