http://www.blogjava.net/supercrsky/articles/219961

本文介绍了一个使用Prototype 1.6实现Ajax请求的示例应用。该应用通过Ajax请求从服务器获取数据并更新页面内容,同时利用事件监听器来显示加载状态。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Prototype1.6 实战11 (Ajax)

jsp:
<% @ page language = " java "  pageEncoding = " gbk " %>
< html >
  
< head >
    
< title > Ajax Test </ title >
  
< script  type ="text/javascript"  src ="prototype.js" ></ script >
 
< script >
     
// 你的action,当然也可以传参
      var  url  =   " ${pageContext.request.contextPath}/ServiceServlet " ;
     
     
function  test()
     
{
         
// Ajax request
          new  Ajax.Request(url,
         
{
             method: 
" post " ,   // post method
             onSuccess :  function (response)      // callback function
              {
                 $(
" d " ).innerHTML  =  response.responseText;
             }

         }

         );
     }
    
     
     
// 注册响应事件
     Ajax.Responders.register(
     
{
         
// 请求时事件
         onCreate :  function ()
         
{
             Element.show(
" loading " );
         }

         ,
         onComplete : 
function ()
         
{
             
// 活动的请求全部完成时时
              if (Ajax.activeRequestCount  ==   0 )
             
{
                 Element.hide(
" loading " );
             }

         }

     }
);
     
 
</ script >  
  
  
</ head >
  
< body >
  
< input  type ="button"  onclick ="test();"  title ="注意观察页面刷新了吗?"  value ="点我试试" />
  
< div  id ="loading"  style ="display: none;" ></ div >
  
< div  id ="d" ></ div >
  
</ body >
</ html >

servlet:
package  com.test;

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;

@SuppressWarnings(
" serial " )
public   class  ServiceServlet  extends  HttpServlet
{

    
public   void  doGet(HttpServletRequest request, HttpServletResponse response)
            
throws  ServletException, IOException
    
{
        
this .doPost(request, response);
    }


    
public   void  doPost(HttpServletRequest request, HttpServletResponse response)
            
throws  ServletException, IOException
    
{
        String msg 
=   " 如果您看到此消息说明已经成功了! " ;
        response.setContentType(
" text/html " );
        response.setCharacterEncoding(
" gbk " );
        PrintWriter out 
=  response.getWriter();
        out.print(msg);
    }


}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值