zoukankan      html  css  js  c++  java

  • Java使用JSP Tag Files & JSP EL Functions打造你自己的页面模板

    1. 简单说明:
    在JSP 2.0后, 你不再需要大刀阔斧地定义一堆TagSupport或BodyTagSupport, 使用JSP Tag Files技术可以实现功能强大的页面模板技术. 在这里抛砖引玉, 结合项目开发, 简单介绍Tag Files技术的应用. 至于详细教程与资料, 请大家参考Java EE Tutorial, 上面有详细的E文资料.
    http://docs.oracle.com/javaee/5/tutorial/doc/bnama.html
    2. 定义模板:/WEB-INF/tags/subView.tag

    1. <?xml version="1.0" encoding="UTF-8" ?>
    2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    3. <!--  
    4. <%@ tag language="java" pageEncoding="UTF-8" isELIgnored="false"%>
    5. <%@ taglib prefix="tags" tagdir="/WEB-INF/tags/"%>
    6. <%@ attribute name="id" required="true"%>
    7. <%@ attribute name="title" required="false"%>
    8. <%@ attribute name="headStyle" required="false" fragment="true"%>
    9. <%@ attribute name="headScript" required="false" fragment="true"%>
    10. <%@ attribute name="body" required="false" fragment="true"%>
    11. <%@ attribute name="footScript" required="false" fragment="true"%>
    12. -->
    13. <html xmlns="http://www.w3.org/1999/xhtml">
    14. <head>
    15. <tags:header />
    16. <!-- 自定义css部分 -->
    17. <jsp:invoke fragment="headStyle" />
    18. <!-- 自定义js部分 -->
    19. <jsp:invoke fragment="headScript" />
    20. </head>
    21. <body class="pbody" id="approveApply">
    22.         <div class="mainhd">
    23.                 <p class="maintit">${title}</p>
    24.         </div>
    25.         <div id="__body__">
    26.                 <!-- 自定义body -->
    27.                 <jsp:invoke fragment="body" />
    28.         </div>
    29.         <jsp:invoke fragment="footScript" />
    30.         <div id="__footer__">
    31.                 <tags:footer version="${version}" />
    32.         </div>
    33. </body>
    34. </html>

    复制代码

    其中, <tags:header>是头部模板, <tags:footer>是底部模板, 小模板再整合到大的<tags:subView>模板
    2. 继承模板, 实现具体页面: /view/deploy/approveApply.jsp

    1. <?xml version="1.0" encoding="UTF-8" ?>
    2. <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
    3. <%@ taglib prefix="tags" tagdir="/WEB-INF/tags/"%>
    4. <%@ taglib prefix="app" uri="http://risecloud.com/app"%>
    5. <tags:subView id="approveApply" title="审核请求">
    6.         <jsp:attribute name="body">
    7.                  <div id="mainGrid"></div>
    8.         </jsp:attribute>
    9.         <jsp:attribute name="footScript">
    10.                  <!-- 覆盖页面样式类 -->
    11.                 <script type="text/javascript" src="${pageContext.request.contextPath}/js/deploy/ApproveApplyGrid.js?${app:pageVersion()}"></script>
    12.                 <script type="text/javascript" src="${pageContext.request.contextPath}/js/deploy/ApproveApplyDialog.js?${app:pageVersion()}"></script>
    13.                 <script type="text/javascript">
    14.                         //<![CDATA[
    15.                         $(function() {
    16.                                 var grid = ApproveApplyGrid.create({
    17.                                         selector : '#mainGrid',
    18.                                         url : window.getCctxUrl('/deploy/approveApply!listGameApply'),
    19.                                         agree : function(ret) {
    20.                                                 alert('agree')
    21.                                         },
    22.                                         deny : function(ret, rec) {
    23.                                                 alert('agree')
    24.                                         }
    25.                                 });
    26.                         });
    27.                         //]]>
    28.                 </script>
    29.          </jsp:attribute>
    30. </tags:subView>

    复制代码

    其中:
    1. id, title, body, footScript等分别是在<tabs:subView>中的模板区域, 这里逐一替换.
    2. ${app:pageVersion()}是自定义的JSP EL Function, 在新版本发布时, 可以迫使用户浏览器更新缓存. 具体定义为/WEB-INF/app.tld,

    1. <?xml version="1.0" encoding="UTF-8"?>
    2. <taglib xsi:schemaLocation="http://java.sun.com/xml/ns/javaee web-jsptaglibrary_2_1.xsd" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="2.1">
    3.         <tlib-version>1.0</tlib-version>
    4.         <jsp-version>2.1</jsp-version>
    5.         <short-name>app</short-name>
    6.         <uri>http://risecloud.com/app</uri>;
    7.         <display-name>app</display-name>
    8.         <function>
    9.                 <name>pageVersion</name>
    10.                 <function-class>com.yy.game.risecloud.taglib.RiseCloundFunctionLib</function-class>
    11.                 <function-signature>java.lang.String pageVersion()</function-signature>
    12.         </function>
    13. </taglib>

    复制代码

    注意EL Function都必须static
    3. 具体效果: 图中红线框外的是模板, 红线框内是继承模板的页面实现, 既统一, 又省事. 这不是你梦寐以求的么?

    注意:
    1. JSP Tag Files默认放在/WEB-INF/tags/目录, 使用文件名直接引用. 如果其他地方, 必须在web.xml中使用<jsp-config>声明!
    2. JSP EL Functions的tld默认放在/WEB-INF/下面, 如果其他地方, 必须在web.xml中使用<jsp-config>声明!
    这二者如果放在默认位置, 在Servlet容器启动时会自动加载. 无需再配置什么! 具体使用, 大家可以参考Java EE Tutorial

  • 相关阅读:
    PHP-FPM doesn't write to error log
    CSS中position属性( absolute | relative | static | fixed )详解
    微信分享踩坑
    使用layer-list实现特殊的效果
    如何正确的给ViewGroup设置OnClickListener
    android:clipchildren属性
    学习有边界吗？学了几年感觉什么也做不出，学习无用？
    电动车的蓄电池与锂电池
    《增长黑客》节选与笔记
    Firefox火狐浏览器的高效使用
  • 原文地址：https://www.cnblogs.com/zolo/p/5849191.html
Copyright © 2011-2022 走看看