?????? 剛開始學習AJAX，其實沒什么難的，主要的思想就是異步傳輸，不用整個刷新頁面，就是JAVASCRIPT技術，新瓶裝老酒罷了；一般分三個步驟走：1、Jsp頁面 2、Servlet 3、Javascript
Step1?? Create a page:? login.jsp
<%@ page contentType="text/html; charset=GBK" %>
<html>
<head>
<title>
Login
</title>
<script src="login.js" type="text/javascript"></script>
</head>
<body bgcolor="#ffffff">
<h1 align="center">
Login
</h1>
<div>
? <table>
??? <tr><td>Username:</td>
??? <td><input id="username" type="text"/></td>
??? </tr>
??? <tr><td>Password:</td>
??? <td><input id="password" type="text"/></td>
? <td id="user"></td></tr>
? </table>
<br/>
<input id="submit" type="button" value="Submit" onclick="linkServer();">
<input type="button" value="Reset">
? </div>
</body>
</html>
這里不用Form，用JS。
Step2? Create a javascript: ?login.js
var xmlHttp;
function linkServer(){
??? xmlHttp=GetXmlHttpObject();
??? if (xmlHttp==null){
???? alert ("Your browser does not support AJAX!");
???? return;
???? }
??? var url="login"+"?"+"username="+document.getElementById("username").value+
??? "&"+"password="+document.getElementById("password").value;
??? xmlHttp.open("GET",url,true);
??? xmlHttp.onreadystatechange=stateChanged;
??? xmlHttp.send(null);
}
function stateChanged() {
? if (xmlHttp.readyState==4){
? alert("xmlState:"+xmlHttp.status);
?? alert("xmlHttp.responseText:"+xmlHttp.responseText);
???? if(xmlHttp.responseText=="DONE"){
???? document.getElementById("user").innerHTML="(登錄成功)";
? }
else
??? document.getElementById("user").innerHTML="(用戶名或密碼錯誤)";
}
}
//獲得HTTP對象
function GetXmlHttpObject(){
? var xmlHttp=null;
? try{
???? xmlHttp=new XMLHttpRequest();
????? }catch (e){
?????? try{
???? xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
??????? }catch (e)
?????? {
???? xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
??? }
? }
return xmlHttp;
}
Step3 Create a java servlet:?Login.java
package com.service;
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
public class Login extends HttpServlet {
??? private static final String CONTENT_TYPE = "text/html; charset=GBK";
??? //Process the HTTP Get request
??? public void doGet(HttpServletRequest request, HttpServletResponse response) throws
??????????? ServletException, IOException {
??????? String u1 = request.getParameter("username");
??????? String p1 = request.getParameter("password");
??????? System.out.println("u1:" + u1);
??????? System.out.println("u2:" + p1);
??????? response.setContentType(CONTENT_TYPE);
??????? PrintWriter out = response.getWriter();
//下面就可以數據庫查詢，這里簡單的作個判斷
??????? if((u1!=null&&u1.equals("hello"))&&((p1!=null&&p1.equals("123456"))))
??????? out.print("DONE");
??? else{
??????? out.print("FAIL");
??? }
??????? out.close();
??? }
??? //Process the HTTP Post request
??? public void doPost(HttpServletRequest request, HttpServletResponse response) throws
??????????? ServletException, IOException {
??????? doGet(request, response);
??? }
}
posted on 2007-09-12 11:51
蔣家狂潮 閱讀(225)
評論(0) 編輯 收藏 所屬分類:
JWeb