当前位置: 首页 > 图文教程 > Java技术 > Web框架 > Web框架：Ajax提供的div标签

Web框架
struts2（三）
struts2（四）
struts2（五）
struts2（六）
Spring中注入概念的简单介绍
深入探讨struts的ActionMessages消息机制(转)
DWR 的 Converter 实现原理简单分析及应用
详解Spring中bean的作用域
AJAX实现级联下拉框
Spring AOP面向方面编程原理：AOP概念
Spring结合Hibernate声明式事务配置
Struts 概述
Ajax 入门简介
Struts配置文件详解
Struts in Spring
Struts 开发的最佳实践
Struts核心标签
开发框架：利用STRUTS实现国际化支持
Struts自定义标签的过程
Struts 框架的基本概念及实现MVC模式的原理

No. « 1 2 3 4 »

技术文章搜索

关键字

Web框架：Ajax提供的div标签

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-08-14   浏览: 253 ::
收藏到网摘: n/a

谈完Ajax框架，小编继续Ajax，说一下Ajax中的div标签，div标签在页面上生成一个div元素，但这个div元素的内容不是静态内容，而是从服务器获取的内容。必须为该div标签指定一个href属性，这个href属性必须是一个action，该action负责生成该div元素的内容。还可以指定该div标签生成的div元素以固定的频率来更新自身的内容，可以指定如下两个属性：

updateFreq：指定更新div的时间间隔，单位是ms，如果不指定，则只在页面加载时更新该div的内容。

delay：指定更新div内容的时间延迟，单位是ms，如果没有指定updateFreq属性，则该属性没有意义。

如果服务器包含了JavaScript代码，且希望在本页面内执行服务器响应的JavaScript代码，则可以为该div标签标签指定executeScripts="true"。

 

例子的页面代码如下：

 

<%@ page contentType="text/html;charset=GBK" language="java" %>

<%@ taglib prefix="s" uri="/struts-tags" %>

<html>

<head>

    <title>远程Div</title>

    <s:head theme="ajax"/>

</head>

<body>

<s:url id="rd" value="/random.action" />

仅一次获取服务器内容的Div<br>

<s:div id="div1"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="%{rd}">

初始化文本

</s:div>

动态更新内容的Div，每隔1s刷新一次(通过指定updateFreq="1000")<br>

使用indicator(通过指定indicator="indicator")<br>

<s:div id="div2"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="%{rd}"

        updateFreq="1000"

        indicator="indicator">

初始化文本

</s:div>

<img id="indicator" src="${pageContext.request.contextPath}/images/indicator.gif" alt="Loading..." style="display:none"/><br>

3s之后才开始更新(通过指定delay="3000")<br>

指定与服务器交互出错的提示(通过指定errorText属性)<br>

指定与服务器交互过程中的提示(通过指定loadText属性)<br>

<s:div id="div3"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="%{rd}"                     //使用变量来指定URL

        updateFreq="1000"

   delay="3000"

   errorText="加载服务器数据出错"

   loadingText="正在加载服务器内容">

初始化文本

</s:div>

指定显示系统出错提示(通过指定showErrorTransportText="true")<br>

<s:div id="div4"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="/AjaxNoUrl.jsp"

        updateFreq="1000"

   showErrorTransportText="true"

   loadingText="正在加载服务器内容">

初始化文本

</s:div>

执行服务器脚本(通过指定executeScripts="true")

<s:url id="test" value="/Test3.action" />

<s:div id="div5"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="%{test}"

        updateFreq="9000"

   executeScripts="true"

   loadingText="正在加载服务器内容">

初始化文本

</s:div>

</body>

</html>

random.action的处理Action和JSP页面内容如下：

public class RandomAction implements Action

{

private String data;

public String getRdmStr()

{

   String result = String.valueOf(Math.round(Math.random() * 10000));

   return data != null && !data.equals("") ? data + result : result;

}

public void setData(String data)

{

   this.data = data;

}

public String getData()

{

   return this.data;

}

public String execute()

{

   return SUCCESS;

}

}

 

<%@ page contentType="text/html;charset=GBK" language="java" %>

<%@ taglib prefix="s" uri="/struts-tags" %>

<%

    request.setAttribute("decorator", "none");

    response.setHeader("Cache-Control","no-cache"); //HTTP 1.1

    response.setHeader("Pragma","no-cache"); //HTTP 1.0

    response.setDateHeader ("Expires", 0); //prevents caching at the proxy server

System.out.println("----------");

%>

服务器返回的随机数字是：<s:property value="rdmStr"/>

 

 

 

第二个Action是直接的JSP页面，页面包含JavaScript代码，页面内容如下：

 

<%@ page contentType="text/html;charset=GBK" language="java" %>

<%

    request.setAttribute("decorator", "none");

    response.setHeader("Cache-Control","no-cache"); //HTTP 1.1

    response.setHeader("Pragma","no-cache"); //HTTP 1.0

    response.setDateHeader ("Expires", 0); //prevents caching at the proxy server

%>

<script language="JavaScript" type="text/javascript">

    alert('Spring2.0宝典');

</script>

轻量级J2EE企业应用实战

<script language="JavaScript" type="text/javascript">

    alert('基于J2EE的Ajax宝典!');

</script>

 

如果我们不需要该div调用远程Java方法，而是定期执行某个JavaScript函数，则可以为该div标签指定一个handler属性，该属性的值为该JavaScript函数。如下例子JSP页面代码：

 

<%@ page contentType="text/html;charset=GBK" language="java" %>

<%@ taglib prefix="s" uri="/struts-tags" %>

<html>

<head>

    <title>远程Div</title>

    <s:head theme="ajax"/>

</head>

<script type="text/javascript">

function handler(widget, node) {

   alert('本地JavaScript函数处理动态Div');

   node.innerHTML = Math.random() > 0.4 ? "Spring2.0宝典" : "轻量级J2EE企业应用实战";

}

</script>

<body>

<s:url id="rd" value="/random.action" />

直接使用本页面的JS函数，不再调用远程服务器<br>

<s:div id="div1"

        theme="ajax"

        cssStyle="border: 1px solid black;background-color:#dddddd;

    width:300px;height:40px;padding-top:8px;padding-left:20px"

        href="%{rd}"       //此时的href属性无效

   updateFreq="2000"

  handler="handler">

初始化文本

</s:div>

</body>

</html>