Ajax简单例子(JSP)

来源:互联网 发布:php 动态调用静态方法 编辑:程序博客网 时间:2024/04/29 13:04
<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 728x15, 创建于 08-4-23MSDN */google_ad_slot = "3624277373";google_ad_width = 728;google_ad_height = 15;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 160x600, 创建于 08-4-23MSDN */google_ad_slot = "4367022601";google_ad_width = 160;google_ad_height = 600;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
首先是JSP页面和脚本,为了方便写在一个里面 

这是一个很常见的检测用户名是否存在的功能 

这里用的是struts 

<%@ page contentType="text/html; charset=GBK" %> 
<html> 
<head> 
<title> 
Ajax 
</title> 
</head> 
<body bgcolor="#ffffff"> 
<h1> 
<input name="username" type="text" maxlength="20" /> 
<input id="chk-name-btn" type="button" value="检测帐号" onclick="testName(’<%=request.getContextPath()%>’)" /> 
<div id="view_name"></div> 
</h1> 
</body> 
</html> 
<script language="javascript"> 
  if (window.ActiveXObject && !window.XMLHttpRequest) { 
      window.XMLHttpRequest=function() { 
      return new ActiveXObject((navigator.userAgent.toLowerCase().indexOf(’msie 5’) != -1) ? ’Microsoft.XMLHTTP’ : ’Msxml2.XMLHTTP’); 
   }; 
  }//取得XMLHttpRequest对象 

function testName(path){ 

//path是取得系统路径 
                var view_name=document.getElementById("view_name"); 
      var req=new XMLHttpRequest(); 
      if (req) { 
          req.onreadystatechange=function() { 
           if (req.readyState==4 && req.status==200) {//判断状态,4是已发送,200已完成 
                 if(req.responseText==0){ 
                 view_name.style.color=’green’; 
                view_name.innerHTML=’该用户名可以正常使用’; 
                 }else if(req.responseText==1){ 
                view_name.style.color=’red’; 
                   view_name.innerHTML=’该用户名已经被使用’; 
                       }else{ 
                     view_name.style.color=’red’; 
                     view_name.innerHTML=’该用户名含有非法字符!’; 
                     } 
                 } 
         } 
                        req.open(’POST’, path+’/Ajax.do’);//struts 

                       //req.open(’POST’, path+’/Ajax.servlet’);//servlet 

                        //req.open(’POST’, path+’/Ajax.action’);//webwork 


                          req.setRequestHeader(’Content-Type’, ’application/x-www-form-urlencoded’); 
                          req.send("");//发送参数如果有参数req.send("username="+user_name);用request取得 
      } 

</script> 

这个JSP页面并没有取得用户名,就是演示一下。还有<div>可以换span,具体作用问美工吧。 

接受Ajax请求的action。 

import org.apache.struts.action.*; 
import javax.servlet.http.*; 
import javax.servlet.http.HttpServlet; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
import java.io.PrintWriter; 

/** 
 * <p>Title:AjaxAction </p> 
 */ 

public class AjaxAction extends Action { 
  public ActionForward execute(ActionMapping mapping, 
                               ActionForm form, 
                               HttpServletRequest request, 
                               HttpServletResponse response) 
      throws Exception { 
    PrintWriter out = response.getWriter(); 
    out.print(1);//Ajax取得都是字符的输出。如果数据量大的话,还可以用xml来发送和接受 
    return null; 
  } 


struts-config.xml 

    <action type="test.whw.upload.AjaxAction" validate="false" scope="request"  path="/Ajax"/> 
---------------------------- 

如果是servlet 

web.xml 

 <servlet> 
  <servlet-name>AjaxServlet </servlet-name> 
  <servlet-class>servlet.AjaxServlet </servlet-class> 
 </servlet> 
    <servlet-mapping> 
        <servlet-name>AjaxServlet </servlet-name> 
        <url-pattern>/AjaxServlet .servlet</url-pattern> 
    </servlet-mapping> 

AjaxServlet.java 

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 AjaxServlet extends HttpServlet { 
 Logger log = Logger.getLogger(this.getClass()); 
 public void doGet(HttpServletRequest request, HttpServletResponse response) 
   throws ServletException,IOException { 
  response.setContentType("text/xml; charset=GBK"); 
  PrintWriter out = response.getWriter(); 
    out.print(2); 
   } 
 } 
 //Process the HTTP Post request 
 public void doPost(HttpServletRequest request, HttpServletResponse response) 
   throws ServletException, IOException { 
  doGet(request, response); 
 } 

 //Process the HTTP Put request 
 public void doPut(HttpServletRequest request, HttpServletResponse response) 
   throws ServletException, IOException { 
 } 

 //Process the HTTP Delete request 
 public void doDelete(HttpServletRequest request, 
   HttpServletResponse response) throws ServletException, IOException { 
 } 

 //Clean up resources 
 public void destroy() { 
 } 


------------------------------------- 

如果是webwork 

xwork.xml 

   <action name="Ajax" class="com.whw.upload.action.webwork.AjaxAction" method="Ajax"/> 


AjaxAction.java 

import java.io.PrintWriter; 

public class AjexAlbumAction extends ActionSupport implements Action{ 

  public void Ajax()throws IOException { 
             PrintWriter pw = ServletActionContext.getResponse().getWriter(); 
            ServletActionContext.getResponse().setContentType("text/html;charset=GBK"); 
            pw.print(1); 
            pw.close(); 
  } 




本例子在winXPsp2、JB9、Eclipse3,j2sdk1.4.1 、Tomcat5、Tomcat4.1都能运行 
<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 728x15, 创建于 08-4-23MSDN */google_ad_slot = "3624277373";google_ad_width = 728;google_ad_height = 15;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
<script type="text/javascript"><!--google_ad_client = "pub-2947489232296736";/* 160x600, 创建于 08-4-23MSDN */google_ad_slot = "4367022601";google_ad_width = 160;google_ad_height = 600;//--></script><script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
原创粉丝点击