首页 文章

CSS和Javascript不适用于使用escape =“false”从h:outputText呈现的内容

提问于
浏览
0

从具有escape =“false”的h:outText呈现的内容未绑定到适用于该页面的css或javascript . 实际上我正在尝试使用语法高亮显示来强调我在帖子中的语法 . 该帖子在数据库中被监视,并通过将escape属性设置为false将其显示在带有h:outputText标记的JSF页面中 . 它会按预期呈现页面,并处理所有html标记,但不应用适用于该帖子中代码块的css或javascript . 下面是我的jsf页面,它从数据库中检索html并通过h:outputText标记显示它 . 检索到的内容具有需要突出显示的语法 .

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
        xmlns:ui="http://java.sun.com/jsf/facelets"
        xmlns:h="http://java.sun.com/jsf/html"
        xmlns:f="http://java.sun.com/jsf/core"
        xmlns:p="http://primefaces.org/ui"
        template="/templates/ui.xhtml">

 <ui:define name="head">
    <title>tekBytes-#{tutorialController.tut.title}</title>

<h:outputScript library="primefaces" name="jquery/jquery.js" />
<link href="/rainbow/themes/pastie.css" rel="stylesheet" type="text/css" />
<script src="/rainbow/rainbow.min.js"></script>
<script src="/rainbow/language/generic.js"></script>
<script src="/rainbow/language/java.js"></script>
<script src="/rainbow/language/css.js"></script>
  <script type = "text/javascript">
/*
 * do some jQuery magic on load
 */
$(document).ready(function() {
    function showHiddenParagraphs() {
        $("pre.hidden").fadeIn(500);
    }
    setTimeout(showHiddenParagraphs, 1000);
});

</script>
  </ui:define>
  <ui:define name="content">
  <div style="margin:20px">
  <h1>#{tutorialController.tut.title}</h1>
  
<h:outputText value="#{tutorialController.tut.contentStr}" escape="false"/> </div> </ui:define> </ui:composition>

3 回答

  • 0

    在JSF 2.0中,所有Web资源文件(如css,图像或JavaScript)都应放在Web资源管理器根目录下的“resources”文件夹中(与“WEB-INF”相同的文件夹级别) .

    将您的js / css放在 resources/jsresources/css 文件夹中,并使用 <h:outputStylesheet<h:outputScript 访问它们

    像这样

    <h:outputScript name="js/rainbow.min.js" />
    

    <h:outputStylesheet name="css/language/css.js" />
    

    等等...


    另请阅读:Resources (Library) In JSF 2.0

  • 0

    可能存在的问题可能在于此处的数量,请按顺序验证以下内容 .

    1) Check your CSS files are getting loaded by the browser 
    by monitoring the request in developer tools on Firefox or chrome.
    
       https://developers.google.com/chrome-developer-tools/docs/overview?hl=fr
    
        2) check the source of your html to see if that looks 
    fine and tags are not encoded etc. 
    
        3) verify your CSS to see it works and it doesn't have missing semicolon,
     brackets,quotes etc by adding it to a test html page on your machine.
    
  • 0

    我解决了 . 实际的问题是存储在数据库中的html是通过p:编辑器生成的,它在每一行都放了很多div标签,所以当它通过h:outputText标签呈现时,css或javascript无法解析代码块因为包围的div和其他标签,它们适用于语法高亮 . 所以我在将所有这些不必要的标签存储到数据库之前就删除了它们 . 感谢大家的回复 .

相关问题