14.javaweb AJAX技術詳解

標籤：password   sys   request對象   完成   cep   取值   for   pre   query   

一、簡介

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，  要求

 

 

  

14.javaweb AJAX技術詳解