Ajax入門

最後更新：2018-07-26 來源：互聯網

上載者：User

創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

<%@ page language="java" import="java.util.*" pageEncoding="gb2312"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<TITLE>Ajax驗證使用者名稱是否存在例子</TITLE>
<script>

//設一個變數

var XMLHttpReq=false;
   //建立一個XMLHttpRequest對象
   function createXMLHttpRequest(){
     if(window.XMLHttpRequest){ //Mozilla
      XMLHttpReq=new XMLHttpRequest();
      }
      else if(window.ActiveXObject){
       try{
        XMLHttpReq=new ActiveXObject("Msxml2.XMLHTTP");
        }catch(e){
         try{
          XMLHttpReq=new ActiveXObject("Microsoft.XMLHTTP");
          }catch(e){}
          }
         }
        }
   //發送請求函數
   function send(url){
    createXMLHttpRequest();
    XMLHttpReq.open("get",url,true);
    XMLHttpReq.onreadystatechange=proce;   //指定響應的函數
    XMLHttpReq.send(null); //發送請求
    }
   function proce(){
    if(XMLHttpReq.readyState==4){ //對象狀態
     if(XMLHttpReq.status==200){//資訊已成功返回，開始處理資訊
                 
     var root=XMLHttpReq.responseXML;
     var res=root.getElementsByTagName("content")[0].firstChild.data;
     window.alert(res);
      
     //var xmlReturn = XMLHttpReq.responseText;
     //window.alert(xmlReturn);
     }else{
      window.alert("所請求的頁面有異常");
      }
      }
      }
   //身分識別驗證
   function check(){
    var name=document.getElementById("name").value;

     if(name==""){
      alert("請輸入姓名!");
      return false;
      }
      else{
       //send('login?name='+name);
       document.getElementById("load").style.display='';
       send('login.do?name='+name);
       document.getElementById("load").style.display='none';
       }
      }

   </script>
</head>

<body>
<form action="login" method="post">
   <table>
       <tr><td>姓名: <input id="name" type="text" name="name"/><p>
        <div id=load style="display:none; position:absolute;right:0px;top:0px;background:#FF5B5B;border:1px solid">正在驗證使用者名稱,請稍後……</div><p>
          <input type="button" value="檢測!" onClick="check()"/>
       </td>
      </tr>
      </table>
      </form>
</body>
</html>

structs-config配置:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts-config PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 1.2//EN" "http://struts.apache.org/dtds/struts-config_1_2.dtd">

<struts-config>
<data-sources />
<form-beans >
<form-bean name="loginForm" type="org.viman.struts.form.LoginForm" />

</form-beans>

<global-exceptions />
<global-forwards />
<action-mappings >
    <action
      attribute="loginForm"
      input="/login.jsp"
      name="loginForm"
      path="/login"
      scope="request"
      type="org.viman.struts.action.LoginAction" />

</action-mappings>

<message-resources parameter="org.viman.struts.ApplicationResources" />
</struts-config>

action實現(LoginAction.java):

package org.viman.struts.action;

import java.io.UnsupportedEncodingException;

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

import org.apache.struts.action.Action;
import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;
import org.viman.struts.form.LoginForm;

/**
* MyEclipse Struts
* Creation date: 01-06-2007
*
* XDoclet definition:
* @struts.action path="/login" name="loginForm" input="/login.jsp" scope="request" validate="true"
*/
public class LoginAction extends Action {
/*
* Generated Methods
*/

/**
* Method execute
* @param mapping
* @param form
* @param request
* @param response
* @return ActionForward
*/
public ActionForward execute(ActionMapping mapping, ActionForm form,
   HttpServletRequest request, HttpServletResponse response) {
  //LoginForm loginForm = (LoginForm) form;// TODO Auto-generated method stub
  try {
      request.setCharacterEncoding("gb2312");
     } catch (UnsupportedEncodingException e) {
      e.printStackTrace();
     }
     try{
      String msgStr="";
      response.setContentType("text/xml;charset=GB2312");
      response.setHeader("Cache-Control","no-cache");
      String name=(String)request.getParameter("name");
      System.out.println("name = "+name);
      if("gong".equals(name)){ //找查資料庫中有無該使用者名稱
      msgStr ="對不起,此使用者名稱已經存在,請更換使用者名稱註冊!";
      }else{
      msgStr ="使用者未被註冊,可以使用!";
      }
      response.getWriter().println("<?xml version='1.0' encoding='GB2312' ?>");
      response.getWriter().println("<root>");
      response.getWriter().println("<content>");
      response.getWriter().print(msgStr);
      response.getWriter().println("</content>");
      response.getWriter().println("</root>");
      response.getWriter().close();
      }catch(Exception ex){

}
return null;

}

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More