在部分标题中可能具有在包含在另一个包含文件中的包含文件中定义的样式类和脚本功能

问题描述 投票:1回答:1

可能在head / head节中具有样式类和脚本功能,其中样式类和脚本功能是在另一个xhtml文件中包含的xhtml文件中定义的。这里是一个例子:

File template.xhtml

<h:body> 

        <ui:insert name="content" >
         Template content
        </ui:insert>

</h:body>

文件content.xhtml

<ui:composition template="template.xhtml">

  <h:outputScript target="head">
        function contentJS()
        {

        }
  </h:outputScript>     

    <ui:define name="content">

        <ui:include src="subcontent.xhtml"/>        

    </ui:define>

</ui:composition>          

File subcontent.xhtml

<ui:composition ...>

  <h:outputScript target="head">
        function subcontentJS()
        {

        }
  </h:outputScript>     

  <style>       
            .mystyleclass {color:red}
  </style>

  <div class="mystyleclass">Text color red</div>

</ui:composition>    

在结果xhtml中,我只有一个javascript函数,而没有两个javascript函数(contentJS和subcontentJS),而mystyleclass不在头部。

templates jsf styles head
1个回答
0
投票

您的标记中有两个问题:

  1. 定义h:outputScriptcontentJS块不在一个块内,因此未合并到呈现的输出中。

  2. style是一个简单的html元素,未放置在head中,而是直接呈现。将此更改为h:outputStylesheet target="head"

template.xhtml:

<!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:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head />

<h:body>

    <ui:insert name="content">
    Template content
    </ui:insert>

</h:body>
</html>

content.xhtml:

<!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:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head />

<h:body>

    <ui:composition template="template.xhtml">

        <ui:define name="content">

            <h:outputScript target="head">
                function contentJS()
                {

                }
            </h:outputScript>

            <ui:include src="subcontent.xhtml" />

        </ui:define>

    </ui:composition>
</h:body>
</html>

subcontent.xhtml:

<!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:ui="http://xmlns.jcp.org/jsf/facelets"
    xmlns:f="http://xmlns.jcp.org/jsf/core"
    xmlns:h="http://xmlns.jcp.org/jsf/html">
<h:head />

<h:body>
    <ui:composition>

        <h:outputScript target="head">
            function subcontentJS()
            {

            }
        </h:outputScript>

        <h:outputStylesheet target="head">
            .mystyleclass {
                color: red
            }
        </h:outputStylesheet>

        <div class="mystyleclass">Text color red</div>

    </ui:composition>
</h:body>
</html>
© www.soinside.com 2019 - 2024. All rights reserved.