Java：Ajax案例

前言

在javaweb中，ajax是前后台交互的技术，可以实现异步请求，不用刷新整个页面就可以完成操作。

案例1：用ajax实现登录

1、在myeclipce中创建web项目，目录结构如下，该建包建包，该建类建类，该建jsp建jsp，该导入jquery导入jquery。

2、实现的功能是：在index.jsp 中用户输入id和username，点击登录，传到后台，如果id为110，username为helloworld，那么页面跳转到pages/sussess.jsp中（当然，是用Ajax实现）
3、前台index.jsp代码

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



  
    
    
    
	
	
	    
	
	
	
	
  
  
  
  
  
  	id:

   username:

   
 
   
  

4、LoginServlet代码

package com.web.servlet;

import java.io.IOException;
import java.io.PrintWriter;

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

public class LoginServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String id = request.getParameter("id");
		String username = request.getParameter("username");
		String flag = "0";
		PrintWriter out = response.getWriter();
		if(id != null && !username.trim().equals("") && username != null){
			if(id.equals("110") && username.equals("helloworld")){
				flag = "1";
				request.getSession().setAttribute("username", username);
				request.getSession().setAttribute("id", id);
			}
		}
		out.print(flag);// 返回登录信息
		out.flush();
		out.close();
	}

}

5、success.jsp 代码（就加了一句${sessionScope.username }）

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



  
    
    
    
    
	
	
	    
	
	

  
  
  
    Hello World ${sessionScope.username }
  

6、效果截图

注：LoginServlet的url-pattern是/LoginServlet

案例2：局部刷新

1、在案例一的基础上，新建了这么几个文件，看下图，没有建的建好

2、实现的功能：在test.jsp 中有一个button，点击button，从后台获取数据，输出到前台的table中。
3、test.jsp代码

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



  
    
    
    
    
	
	
	    
	
	
	
	

  
  
  
	查看
	
	
  

4、几个java类的代码

package com.domain;

public class User {

	private String id;
	private String username;
	public User() {
		super();
		// TODO Auto-generated constructor stub
	}
	public User(String id, String username) {
		super();
		this.id = id;
		this.username = username;
	}
	@Override
	public String toString() {
		return "User [id=" + id + ", username=" + username + "]";
	}
	public String getId() {
		return id;
	}
	public void setId(String id) {
		this.id = id;
	}
	public String getUsername() {
		return username;
	}
	public void setUsername(String username) {
		this.username = username;
	}
	
}

package com.common;

import java.util.ArrayList;

import com.domain.User;

public class UserFactory {

	/**
	 * 这个方法可以从数据库中提取
	 * @return
	 */
	public static ArrayList getUsers(){
		ArrayList users = new ArrayList();
		User user = null;
		for (int i = 0; i < 10; i++) {
			user = new User(i+"","user"+i);
			users.add(user);
		}
		
		return users;
	}
}

package com.web.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;

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

import net.sf.json.JSONArray;

import com.common.UserFactory;
import com.domain.User;

public class ShowServlet extends HttpServlet {

	private static final long serialVersionUID = 1L;

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {

	}

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		ArrayList users = UserFactory.getUsers();
		JSONArray jsonArray2 =JSONArray.fromObject(users);
		PrintWriter out = response.getWriter();
		out.print(jsonArray2);
		out.flush();
		out.close();
	}

}

注1：ShowServlet的url-pattern是/ShowServlet
注2：原理什么的我简单说，Java里面生成的是ArrayList，要把它转化成json格式（我用了JSONArray），需要用几个jar包；相应的，在前台收到后台发送过来的json格式，需要解析（JSON.parse），因为我后台传输的是JSONArray，所以前台解析出来的就是json数组形式，因此循环遍历一下就可以了。
注3：案例2需要的jar包下载地址：http://download.csdn.net/download/tsfx051435adsl/10157423

案例截图：