这个比较jquery、单纯ajax异步简单多了,不多说了直接上代码。
需要引入:ajaxanywhere-1.2.1.jar (最新)和 /ajaxAnyWhereDemo/WebRoot/js/aa.js ,
免费下载地址http://download.csdn.net/detail/xuke6677/8064977
目录结构如下:
1、ListBean.java 实体类
package org.ydd.test; public class ListBean { private String id; private String name; private String sex; private String work; private String address; //get(),set()…… 省略 }
2、 AjaxAnyWhereTest.java 后台servlet
package org.ydd.test; import java.io.IOException; import java.util.ArrayList; import java.util.List; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class AjaxAnyWhereTest extends HttpServlet { private static final long serialVersionUID = -5750167075517567170L; List<ListBean> rs = new ArrayList<ListBean>(); @Override public void init() throws ServletException { ListBean userBean = new ListBean(); userBean.setId("1"); userBean.setName("张三"); userBean.setSex("123"); userBean.setWork("prom"); userBean.setAddress("fdsfsd"); rs.add(userBean); } public void doGet(HttpServletRequest request,HttpServletResponse response) throws ServletException,IOException { doPost(request,response); } public void doPost(HttpServletRequest request,IOException { ListBean userBean = new ListBean(); String id= request.getParameter("id"); if(!"".equals(id) && id!=null){ userBean.setId(id); userBean.setName(request.getParameter("name")); userBean.setAddress(request.getParameter("address")); userBean.setSex(request.getParameter("sex")); userBean.setWork(request.getParameter("work")); rs.add(userBean); } if(rs.size()>0){ request.setAttribute("queryList",rs); } request.getRequestDispatcher("list.jsp").forward(request,response); } }
3、web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <!-- Ajax配置开始,带编码转换(包括ajax提交的编码) --> <filter> <filter-name>AjaxAnywhere</filter-name> <filter-class>org.ajaxanywhere.AAFilter</filter-class> <init-param> <param-name>encoding</param-name><!-- 普通提交方式编码 --> <param-value>GB2312</param-value> </init-param> <init-param> <param-name>ajaxencoding</param-name><!-- AJAX提交方式编码 --> <param-value>GB2312</param-value> </init-param> </filter> <filter-mapping> <filter-name>AjaxAnywhere</filter-name> <url-pattern>*</url-pattern> </filter-mapping> <servlet> <servlet-name>AjaxAnyWhereTest</servlet-name> <servlet-class>org.ydd.test.AjaxAnyWhereTest</servlet-class> </servlet> <servlet-mapping> <servlet-name>AjaxAnyWhereTest</servlet-name> <url-pattern>/AjaxAnyWhereTest</url-pattern> </servlet-mapping> <!-- Ajax配置结束 --> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>
4、index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>My JSP 'index.jsp' starting page</title> <Meta http-equiv="pragma" content="no-cache"> <Meta http-equiv="cache-control" content="no-cache"> <Meta http-equiv="expires" content="0"> <Meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <Meta http-equiv="description" content="This is my page"> </head> <body> <jsp:forward page="AjaxAnyWhereTest"/> </body> </html>
5、list.jsp
注:需要引入<script language="javascript" src="js/aa.js"></script>
可以封装一下
定义空的form表单只做跳转用<form name="listForm" action="/newActivity/hotSummerDays.html" method="post"></form>
var url = "/newActivity/hotSummerDays.html?tradeId=lightenCountAndUser"; publicSch("formlist","listForm",url);<span style="white-space:pre"> function publicSch(listName,formName,url){ ajaxAnywhere.formName=formName; ajaxAnywhere.getZonesToReload = function(){ return listName; } var f=document.listForm; f.action=url; ajaxAnywhere.submitAJAX(); }
6、注意问题:
<body> <h1> HTTP Status 404 - /newActivity/undefined </h1> <HR size="1" noshade="noshade"> <p> <b>type</b> Status report </p> <p> <b>message</b> <u>/newActivity/undefined</u> </p> <p> <b>description</b> <u>The requested resource is not available.</u> </p> <HR size="1" noshade="noshade"> <h3> Apache Tomcat/6.0.41 </h3> </body>
1、如果有使用jquery,一定要注意js的加载顺序。
<title></title> <script type="text/javascript" charset="utf-8" src="/js/aa.js"/> <script type="text/javascript" src="/js/jquery-1.4.4.min.js"></script> </head>
2、
7、可以用在局部分页,只刷新分页的地方