14.javaweb AJAX技术详解

一、简介

1，  ajax：在不重新加载网页的前提下，与服务器交换数据并更新部分网页的技巧，但其本身并不是一种新技术

2，  核心：XMLHttpRequest对象。AJAX技术主要是通过此对象完成的。

在创建此对象的时候一定要考虑浏览器的问题

XMLHttpRequest对象的创建

XMLHttpRequest对象属性

其中readyState有五种取值

XMLHttpRequest对象方法

3，  简单示例：利用ajax完成局部刷新功能:局部刷新，在<span>中导入content.html内容

content.html内容

Flush.html

xmlHttp.onreadystatechange=showMsgCallback;表示当xmlHttp的请求状态改变时，就会调用showMsgCallback()方法，事实上，当xmlHttp.send()发送请求到响应完成，readyState会经历”2“（请求正在处理）、”3”（请求已经处理）、”4“（响应完成）三次变化，如果回调函数在xmlHttp.send()之前设置，便会调用三次showMsgCallback()方法。我们设置readyState=4时执行操作，因为此时响应完成，服务器会把回应内容填充到xmlHttp.response***属性中

点击“调用ajax显示内容”则会动态的在<span>中生成”取得数据”

二、ajax异步验证:当新用户注册信息时，输入ID后，异步验证ID是否可用

login.html

注意此处用到的地址重写的方式

Checkservlet

package com.chen.ying;
 
import java.io.PrintWriter;
 
import java.sql.Connection;
 
import java.sql.DriverManager;
 
import java.sql.PreparedStatement;
 
import java.sql.ResultSet;
 
import javax.servlet.http.HttpServlet;
 
import javax.servlet.http.HttpServletRequest;
 
import javax.servlet.http.HttpServletResponse;
 
public class CheckId extends HttpServlet {
 
    final String DBDIVRE="com.mysql.jdbc.Driver";
 
    final String URL="jdbc:mysql://localhost:3306/test";
 
    final String USER="root";
 
    final String PASSWORD="1995228";
 
     Connection conn=null;
 
    PreparedStatement pstmt=null;
 
    ResultSet rs=null;
 
    public void doGet(HttpServletRequest req,HttpServletResponse res){
 
        int  userid=Integer.parseInt(req.getParameter("userid"));
 
        try{
 
            System.out.println(userid);
 
            PrintWriter out=res.getWriter();//得到回应的输出流
 
            Class.forName(DBDIVRE);
 
            conn=DriverManager.getConnection(URL,USER,PASSWORD);
 
            String sql="select userid from person where userid=?";
 
            pstmt=conn.prepareStatement(sql);
 
            pstmt.setInt(1, userid);
 
            rs=pstmt.executeQuery();
 
            if(rs.next()){
 
                System.out.println("用户ID重复");
 
                out.print("true");
 
            }
 
            else{
 
                System.out.println("ID可用");
 
                out.print("false");
 
            }
 
        }catch(Exception e){
 
            System.out.println(e);
 
        }  
 
        }
 
    public void doPost(HttpServletRequest req,HttpServletResponse res){
 
        this.doGet(req, res);
 
    }
 
}

效果

当用户输入id，光标离开输出框后，利用ajax技术，异步验证输入的id是否重复

三、返回XML数据

1，  要求