相关疑难解决方法(0)
如何在Facelets模板中引用CSS/JS /图像资源？
我已经完成了关于Facelets模板的教程.
现在我尝试创建一个与模板不在同一目录中的页面.我有页面样式的问题,因为样式用相对路径引用,如下所示:
<link rel="stylesheet" href="style_resource_path.css" />
我可以通过以下开头使用绝对引用/:
<link rel="stylesheet" href="/project_root_path/style_resource_path.css" />
但是,当我将应用程序移动到不同的环境时,这将给我带来麻烦.
所以我想知道在Facelets中引用CSS(以及JS和图像)资源的最佳方法是什么？
推荐指数
解决办法
查看次数
推迟加载和解析PrimeFaces JavaScript文件
在使用Google PageSpeed分析JSF 2.1 + PrimeFaces 4.0 webapp的性能时,它建议推迟解析JavaScript文件.在一个测试页面<p:layout>,并用表格<p:watermark>和<p:fileUpload>它看起来像如下...
<p:layout>
<p:layoutUnit position="west" size="100">Test</p:layoutUnit>
<p:layoutUnit position="center">
<h:form enctype="multipart/form-data">
<p:inputText id="input" />
<p:watermark for="input" value="watermark" />
<p:focus for="input" />
<p:fileUpload/>
<p:commandButton value="submit" />
</h:form>
</p:layoutUnit>
</p:layout>
...它列出了可以推迟的以下JavaScript文件:
primefaces.js(219.5KiB)jquery-plugins.js(191.8KiB)jquery.js(95.3KiB)layout.js(76.4KiB)fileupload.js(23.8KiB)watermark.js(4.7KiB)
它链接到此Google开发人员文章,其中解释了延迟加载以及如何实现它.你基本上需要<script>在onload事件期间动态创建所需的window.在最简单的形式下,旧的和错误的浏览器被完全忽略,它看起来像这样:
<script>
window.addEventListener("load", function() {
var script = document.createElement("script");
script.src = "filename.js";
document.head.appendChild(script);
}, false);
</script>
好吧,如果您可以控制这些脚本,这是可行的,但所列出的脚本都被JSF强制自动包含.此外,PrimeFaces呈现一堆内嵌的脚本到HTML被直接调用输出$(xxx)从 …
推荐指数
解决办法
查看次数
具有共享代码的多个JSF项目的结构
我有两个共享大量代码的JSF项目 - java类,xhtml文件,标记库,css和javascript文件等.我的开发环境/平台主要包括Eclipse,Ant,Perforce和Tomcat.
有没有人找到一种方法来创建和组织共享代码,以便公共代码可以保留在一组文件夹中？
Eclipse可以很容易地为java源添加外部文件夹,但不能满足其他文件类型.我很欣赏任何想法.
推荐指数
解决办法
查看次数
如何将JSF图像资源引用为CSS背景图像url
我经常使用图像属性更改按钮的图像,但有人告诉我,使用.css这是一个很好的做法我试过但我不能,我做错了什么？这就是我做的:
1 - 我的项目资源存储如下:
2 - 这就是我创建style.css以访问图像的方式
.c2 {
background: url(/resources/images/smiley.jpg);
}
3 - 这是我从我的页面正文访问css的方式(我确定这是正确的,因为同一文档中的其他类适用于此页面中的其他标记)
<h:outputStylesheet library="css" name="style.css" />
4 - 这是创建使用适当的css类的示例commandButton的方法
<h:commandButton styleClass="c2"/>
我认为问题出现在.css中,我尝试了几种组合但没有效果:
background-image: url(/resources/images/smiley.jpg);
background: url(resources/images/smiley.jpg);
background: url(smiley.jpg);
background: url(../smiley.jpg);
哪里出错了？
更新 我设法通过以下代码使其工作:
.c2 {
background: url("#{resource['images:smiley.jpg']}");
}
注意我使用css(右)和使用图像属性时的差异(左)
我怎么能解决这个问题,以便显示保持图像？
推荐指数
解决办法
查看次数
JSF/Facelets:使用<h:outputStylesheet>标记无法识别CSS文件
我正在使用JSF/Facelets开发一个项目.我想在我的View XHTML上做一些CSS更改,但是当我在Tomcat服务器中部署我的Web应用程序时没有任何反应.我尝试了很多技巧,但我得到了相同的结果.
无论如何,这是我的"styles.css":
body { width: 750px; }
#header
{
width: 100%;
font-size: 36px;
font-weight: bold;
line-height: 48px;
background-color: navy;
color: white;
}
#footer
{
width: 100%;
font-weight: bold;
background-color: navy;
color: white;
}
这是主要模板"Template.html",包括"Header.html"和"Footer.html",其中我使用标签放置我的"styles.css":
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets">
<head>
<h:outputStylesheet name="css/styles.css" />
<!-- i've also tried this one, using the "library" attribute -->
<!--
<h:outputStylesheet library="css" name="styles.css" />
-->
</head>
<h:body>
<h:panelGroup id="page" layout="block">
<h:panelGroup id="header" layout="block">
<ui:insert name="header">
<ui:include …推荐指数
解决办法
查看次数
Maven和JSF webapp结构,完全放置JSF资源
我真的不了解Maven和JSF webapp的目录结构.
当我生成项目时,我有这样的结构:
src
|_ main
|_ java
|_ resources
|_ webapp
|_ WEB-INF
|_ web.xml
|_ index.xhtml
我想要包含一些资源:
- javascript文件
- css文件
- 图片
- i18n文件
我可以包含i18n文件src/main/resources但不在任何地方我可以包含JS文件,CSS文件和图像里面src/main/webapp/resources但不是任何地方...
我没有在网上找到关于JSF和Maven目录结构的非常明确的规则.
请问有什么规定？
谢谢
推荐指数
解决办法
查看次数
仅显示带图像的命令按钮
我试图只在我的页面上显示一个带图像的按钮,但我看到的只是带有^的按钮.以下是我的按钮的代码:
<p:commandButton onclick="lineSearch.show();" image="backgroung-image:url(/images/title_logo.jpg)"/>
<p:dialog header="Modal Dialog" widgetVar="lineSearch" modal="true" onCloseUpdate="lineIdField" showEffect="scale" hideEffect="explode">
<ui:include src="lineSearch.xhtml"/>
</p:dialog>
图像确实存在于images文件夹中.该按钮在页面中呈现如下:
<button id="j_idt23:j_idt27" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only" type="submit" onclick="lineSearch.show();;PrimeFaces.ab({formId:'j_idt23',source:'j_idt23:j_idt27',process:'@all'});return false;" name="j_idt23:j_idt27" role="button" aria-disabled="false">
<span class="ui-button-icon-primary ui-icon backgroung-image:url(/images/title_logo.jpg)"></span>
<span class="ui-button-text">ui-button</span>
</button>
<script type="text/javascript">
widget_j_idt23_j_idt27 = new PrimeFaces.widget.CommandButton('j_idt23:j_idt27', {text:false,icons:{primary:'backgroung-image:url(/images/title_logo.jpg)'}});
</script>
谢谢!!!
推荐指数
解决办法
查看次数
如何通过h:outputScript包含JavaScript文件？
我想使用jQuery Validate插件和JSF进行客户端表单验证.我发现导入资源的基本困难.
在我的JSF页面中
<h:outputScript library="js" name="jquery-1.6.2.js"></h:outputScript>
<h:outputScript library="js" name="jquery.validate.js"></h:outputScript>
<h:outputScript library="js" name="jquery.maskedinput.js"></h:outputScript>
<h:outputScript library="js" name="myapp.validate.js"></h:outputScript>
当我单击Firefox中的脚本选项卡时,我无法在下拉列表中看到任何脚本文件.有一条消息显示:
如果标签具有"type"属性,则它应该等于"text/javascript"或"application/javascript".脚本也必须是可解析的(语法正确).
我的jquery效果如鼠标悬停,隐藏,显示等不起作用.我尝试使用通常的脚本标签
<script type="text/javascript" src="../js/jquery-1.6.2.js"></script>
<script type="text/javascript" src="../js/jquery.validate.js"></script>
<script type="text/javascript" src="../js/jquery.maskedinput.js"></script>
<script type="text/javascript" src="../js/myapp.validate.js"></script>
哪个没用.仍然无法找到我的JS文件.我的所有JS文件都放在
Web pages
|_ js
|_jquery-1.6.2.js,my.validate.js,jquery.validate.js,jquery.maskedinput.js
我尝试了使用jQuery和JSF 2.0资源发布的解决方案之一,但没有成功.
请建议我解决这个问题.我不想在ajax中使用JSF内置验证,因为我们将代码从JSP移到JSF并且已经编写了验证.我想重用我之前写过的现有jQuery验证.
推荐指数
解决办法
查看次数
JSF缓存静态资源过滤器
如何编写一个过滤器,根据Google的建议(https://developers.google.com/speed/docs/best-practices/caching)适当缓存静态资源.
是否足以创建一个过滤器,将过去修改的日期设置为某个静态日期(每次服务器重新启动时都会更改)？
为所有可缓存资源指定Expires或Cache-Control max-age之一以及Last-Modified或ETag之一非常重要.指定Expires和Cache-Control:max-age或指定Last-Modified和ETag都是多余的.
上面的链接似乎建议您需要指定Expires或Cache-Control.为什么这有必要？
推荐指数
解决办法
查看次数
javax.faces.PROJECT_STAGE的使用
我想了解'javax.faces.PROJECT_STAGE'属性对JSF应用程序的影响.下面的链接中提供了一个很好的用例
http://css.dzone.com/news/jsf-20-new-feature-preview-ser
http://www.java-tutorial.ch/java-server-faces/jsf-project-stage
除了提供验证错误消息之外,还有其他用例,这个属性真的有用吗？我知道我们可以检查这个变量来识别环境并改变某些功能,但是JSF会自动帮助开发人员吗？如果您可以分享项目的经验,那会很棒吗？
推荐指数
解决办法
查看次数