我正在使用spring mvc 3和tile 2以及通配符定义。我想在我的一些瓷砖中加载额外的css和javascript文件。有办法做到这一点吗?最好是在tile jsp文件中,而不是在tiles-definitions.xml。
中答案 0 :(得分:8)
这是一个很好的问题,因为瓷砖的主要优点之一是它在构图方面提供的中心视图。如果这种集中化还可以包括CSS& JS文件也是如此。
碰巧这个是可能,这是一个例子。这个例子使用了tiles3,但是应该很容易适应tiles-2(tile 3允许你使用多种类型的表达式),你可以这样做。
另请注意,我使用Struts2作为我的动作框架,这不是问题但是因为我将使用一个工作示例,您将知道“OGNL:”前缀表达式意味着将使用EL Struts2使用。您还应该知道,如果升级到Tiles-3,您还可以通过在表达式前添加“MVEL:”来使用Spring EL。
<强> tiles.xml 强>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE tiles-definitions PUBLIC "-//Apache Software Foundation//DTD Tiles Configuration 3.0//EN" "http://tiles.apache.org/dtds/tiles-config_3_0.dtd">
<tiles-definitions>
<definition name="default" template="/WEB-INF/template/template.jsp">
<put-list-attribute name="cssList" cascade="true">
<add-attribute value="/style/cssreset-min.css" />
<add-attribute value="/style/cssfonts-min.css" />
<add-attribute value="/style/cssbase-min.css" />
<add-attribute value="/style/grids-min.css" />
<add-attribute value="/script/jquery-ui-1.8.24.custom/css/ui-lightness/jquery-ui-1.8.24.custom.css" />
<add-attribute value="/style/style.css" />
</put-list-attribute>
<put-list-attribute name="jsList" cascade="true">
<add-attribute value="/script/jquery/1.8.1/jquery.min.js" />
<add-attribute value="/script/jquery-ui-1.8.24.custom/js/jquery-ui-1.8.24.custom.min.js" />
<add-attribute value="/script/jquery.sort.js" />
<add-attribute value="/script/custom/jquery-serialize.js" />
</put-list-attribute>
<put-attribute name="title" value="defaults-name" cascade="true" type="string"/>
<put-attribute name="head" value="/WEB-INF/template/head.jsp"/>
<put-attribute name="header" value="/WEB-INF/template/header.jsp"/>
<put-attribute name="body" value="/WEB-INF/template/body.jsp"/>
<put-attribute name="footer" value="/WEB-INF/template/footer.jsp"/>
</definition>
<definition name="REGEXP:\/recruiter#candidate-input\.(.*)" extends="default">
<put-list-attribute name="cssList" cascade="true" inherit="true">
<add-attribute value="/style/recruiter/candidate-input.css" />
</put-list-attribute>
<put-list-attribute name="jsList" cascade="true" inherit="true">
<add-attribute value="/script/widgets/resume/resume.js" />
</put-list-attribute>
<put-attribute name="body" value="/WEB-INF/content/recruiter/candidate-input.jsp"/>
</definition>
<definition name="REGEXP:(.*)#(.*)" extends="default">
<put-attribute name="title" cascade="true" expression="OGNL:@com.opensymphony.xwork2.ActionContext@getContext().name"/>
<put-attribute name="body" value="/WEB-INF/content{1}/{2}"/>
</definition>
</tiles-definitions>
<强> /WEB-INF/template/template.jsp 强>
<%@taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles" %>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@page contentType="text/html" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<tiles:insertAttribute name="head"/>
<body>
<%-- website header --%>
<div id="wrapper">
<div id="content">
<tiles:insertAttribute name="header"/>
<tiles:insertAttribute name="body"/>
<div class ="outer content">
<tiles:insertAttribute name="footer"/>
</div>
</div>
</div>
</body>
</html>
这是将CSS文件和JS文件列表放入头部磁贴的重要部分:
<强> /WEB-INF/template/head.jsp 强>
<%@taglib prefix="tiles" uri="http://tiles.apache.org/tags-tiles"%>
<%@taglib prefix="s" uri="/struts-tags"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<tiles:importAttribute name="cssList"/><tiles:importAttribute name="jsList"/>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<s:iterator value="#attr.cssList" var="cssValue">
<link href="<s:url value="%{cssValue}"/>" rel="stylesheet" type="text/css">
</s:iterator>
<s:iterator value="#attr.jsList" var="jsValue">
<script src="<s:url value="%{jsValue}"/>"></script>
</s:iterator>
<title><tiles:insertAttribute name="title" defaultValue="no title"/></title>
</head>
我想你可以弄清楚剩下的了。对于最后一个块中的<s:iterator>
标签感到抱歉,我不确定Spring的等价物,也不倾向于测试它。但是,如果你把它翻译成春天,那么你在这里自我回答会很棒。我很乐意投票。
答案 1 :(得分:1)
在dispatcher-servlet.xml中提供mvc静态资源映射,如下所示:
<!-- static resource mapping for style sheets, etc. -->
<mvc:resources mapping="/styles/**" location="/WEB-INF/skins/" />
<mvc:resources mapping="/scripts/**" location="/WEB-INF/scripts/" />
在您的tiles-layout.jsp文件中,您可以通过编写
来访问它们<script type="text/javascript" src="${context}/scripts/jquery-1.7.js></script>
<link rel="stylesheet" type="text/css" href="${context}/styles/css/superfish.css">
请参阅:mvc:resources
答案 2 :(得分:1)
这就是我对Spring的看法,剩下的就像Quaternion发布的那样。
<强> /WEB-INF/template/head.jsp 强>
<tiles:importAttribute name="cssList"/>
<tiles:importAttribute name="jsList"/>
<head>
<c:forEach var="cssValue" items="${cssList}">
<link type="text/css" rel="stylesheet" href="<c:url value="${cssValue}"/>" />
</c:forEach>
<c:forEach var="jsValue" items="${jsList}">
<script src="<c:url value="${jsValue}"/>"></script>
</c:forEach>
</head>
不要忘记在每个页面上指出 tiles.xml
中的正确定义<tiles:insertDefinition name="definitionName">
<tiles:putAttribute name="body">
//content
</tiles:putAttribute>
</tiles:insertDefinition>