Ajax简单例子(JSP)

ajax|js

首先是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="检测帐号"  /> 
<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都能运行 

时间: 2024-08-03 12:35:26

Ajax简单例子(JSP)的相关文章

jquery与 ajax 简单例子

jquery与 ajax 简单例子 基于JQuery框架的AJAX PS:本人这篇始发于PHPCHINA,发现被很多人转了,但却未注明出处,想了一下,还是自己转到这里来. 前几天发了个贴,分享了prototype框架关于AJAX方面的学习过程.然后有人说jquery框架更方便. 正好项目中准备使用thickbox,于是干脆抛弃prototype.js,看起jquery.js了.JQuery确实不错,体积比Prototype小了许多,而且使用起来更方便更灵活.有人说Prototype像JAVA,正

ajax简单例子问题!用户验证!

问题描述 123.jsp代码如下:<%@pagelanguage="java"import="java.util.*"pageEncoding="GBK"%><!DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN"><html><head><basehref=""><title>1

邮件发送简单例子-jsp文件

js MailExample.jsp <html> <head> <title>JSP JavaMail Example </title> </head> <body> <%@ page import="java.util.*" %> <%@ page import="javax.mail.*" %> <%@ page import="javax.mail

邮件发送简单例子-jsp文件_JSP编程

MailExample.jsp <html><head><title>JSP JavaMail Example </title></head> <body> <%@ page import="java.util.*" %><%@ page import="javax.mail.*" %><%@ page import="javax.mail.interne

一个ajax简单例子

把url返回的数据,填充到指定id的div中   客户端: test.html   <script>function createXMLHttp(){    var ret = null;    try {        ret = new ActiveXObject('Msxml2.XMLHTTP');    }    catch (e) {        try {            ret = new ActiveXObject('Microsoft.XMLHTTP');      

chrome-ajax简单例子中的错误

问题描述 ajax简单例子中的错误 写了一个非常简单的ajax实例,但在chrome调试时报一下错误: 为什么 .ajax前面的$符号不见了. 这是我的代码: 解决方案 问题解决了,原来是jquery中的$关键字和这里的$冲突了.把$.ajax改成jQuery.ajax就可以了(先引入jquery.js) 解决方案二: 上面少了个}..... 解决方案三: c#.net下简单的Ajax例子$.ajax 的简单小例子AJAX的简单例子 解决方案四: 应该把它写在一个函数里头的 然后直接调用就行了

jquery的ajax方式调用json简单例子

  jquery的ajax方式调用json简单例子 前台: <script type="text/javascript" src="jquery-1.5.1.min.js"></script> <script type="text/javascript">         //test  function test(uid)  {    if(confirm("确定该用户操作"+uid+&q

数据库访问简单实现---edainfo-model(三)——简单例子

model|访问|数据|数据库 下面就正式来讲一下开发步骤:首先,在Tomcat5.X下建一个jdbc/edainfo的数据源,数据库可以是oracle.sql server.mysql.表的结构如下:CREATE TABLE example (id varchar(13) NOT NULL ,name varchar(50) NULL ,address varchar(50) NULL ) ON [PRIMARY]其中,id为主键.datasource.xml内容如下:<?xml versio

VS2005/AJAX-VS2005中AJAX简单应用

VS2005/AJAX-VS2005中AJAX简单应用 AJAX不用说大家都明白,不明白的请百度或Google一下人家比我说的专业,笔者写此篇文章不在于介绍多深奥的东西,这样只举一个很简单的例子来引导到大家.此例只为让大家明白AJAX的基本的调用需要做那些事情笔者用的是VS2005引用AJAX2.0程序集(AJAXPro.2.dll) . 在web.config文件中的<system.web>加入以下设置 <httpHandlers> <add verb="POST