JSP学习笔记(六十一)：使用Struts2中的ajax

第一个例子：动态的加载一个页面到div中

test1.jsp

<s:head theme="ajax" />
<s:url id="ajaxUrl" value="/test2.jsp"></s:url>
<s:div theme="ajax" href="%{ajaxUrl}"></s:div>

test2.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@page import="java.util.Date"%>
<%=new Date().toLocaleString()%>

这样打开test1.jsp就可以看到效果了。

 

对test1.jsp页面稍加修改，可以实现每隔多少毫秒加载一次：

<s:url id="ajaxUrl" value="/test2.jsp"></s:url>
<s:div theme="ajax" href="%{ajaxUrl}" updateFreq="2000"></s:div>

上面的例子是每隔2000毫秒，也就是每隔2秒加载一次

 

 

第二个例子：点击一个链接（或者一个按钮），动态的加载一个页面到div中

test3.jsp

<s:head theme="ajax" />
<s:url id="ajaxUrl" value="/test2.jsp"></s:url>
<s:a theme="ajax" href="%{ajaxUrl}" targets="t1">a test link</s:a>
<div id="t1">aabb</div>

打开test3.jsp，点击链接就可以看到效果了，把s:a替换成s:submit就是点击按钮

 

然后对test3.jsp稍加修改，让test3.jsp可以执行加载页面的javascript：

<s:head theme="ajax" />
<s:url id="ajaxUrl" value="/test2_2.jsp"></s:url>
<s:a theme="ajax" href="%{ajaxUrl}" executeScripts="true">a test link</s:a>
<s:submit theme="ajax" href="%{ajaxUrl}" executeScripts="true"></s:submit>

test2_2.jsp

<script language="javascript">
window.alert(123);
</script>

 

然后再对test3.jsp修改，让动态加载前进行确认：

<s:head theme="ajax" />
<SCRIPT type="text/javascript">
   dojo.event.topic.subscribe("/confirm", function(data, type, e){
       if(type=="before")
       {
           if(!window.confirm("确认要提交吗？"))
           {
               e.cancel = true;
             }
         }
   });
</SCRIPT>
<s:url id="ajaxUrl" value="/test2_2.jsp"></s:url>
<s:a theme="ajax" href="%{ajaxUrl}" executeScripts="true">a test link</s:a>
<s:submit theme="ajax" notifyTopics="/confirm" href="%{ajaxUrl}" executeScripts="true"></s:submit>

type可以是before,load或者error，意思是加载前，加载后或者发生错误时

 

注意：在页面要引入struts2的标签：<%@ taglib prefix="s" uri="/struts-tags" %>