Javascript在JSF模板下不起作用 [英] Javascript does not work under JSF template

查看:126
本文介绍了Javascript在JSF模板下不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用JSF模板和Primefaces。

Javascript代码似乎并未在ui:composition和ui:define标签下工作。下面的代码不会触及loaded()方法。这是content.xhtml文件

 < h:head> 
< script language =javascript>
函数loaded(){
alert(Working !!);
}
< / script>
< / h:头>

< ui:define name =content>
< h:body style =width:100%; height:100%;的onload = 加载() >
< p class =item>随机文本< / p>
< / h:body>
< / ui:define>
< / ui:composition>

但是当我删除define和composition标签时,加载的函数被调用。任何想法为什么发生这种情况?



这是模板文件

 <!DOCTYPE html PUBLIC -  // W3C // DTD XHTML 1.0 Transitional // EN
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\"> ;
xmlns:h =http://java.sun.com/jsf/html
xmlns:f =http://java.sun.com/jsf/core
xmlns:ui =http://java.sun.com/jsf/facelets
xmlns:p = http://primefaces.org/ui >


< h:head>
< title>< ui:insert name =title>模板< / ui:insert>< / title>
< / h:头>

< h:body>

< div id =header>
< ui:insert name =header>
< ui:include src =../ menu.xhtml/>
< / ui:insert>
< / div>


< div id =content>
< ui:insert name =content>
< ui:include src =../ content.xhtml/>
< / ui:insert>
< / div>

< div id =footer>
< ui:insert name =footer>
这是一个页脚
< / ui:insert>
< / div>




解决方法 < ui:composition> 在构建视图时忽略 。此外,再次重新声明< h:body> 是不必要的。要使用在页面加载期间运行的脚本,最好使用< h:outputScript target =body> 。这将被重新定位到body的结尾,并在构建必要的HTML DOM元素之后调用。这比 onload 还要快一些。



所有这些都是你的整个 content.xhtml 必须如下所示:

 < ui:合成template =/ template / template.xhtml
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
>
< ui:define name =content>
< h:outputScript target =body>
alert(Working !!);
< / h:outputScript>

< p class =item>随机文本< / p>
< / ui:define>
< / ui:composition>



另请参阅:




I'm using JSF templates and Primefaces.

Javascript code does not seem to be working under ui:composition and ui:define tags. The following code is not hitting the loaded() method. This is the content.xhtml file

<h:head>
<script language="javascript">
    function loaded() {
        alert("Working!!");
    }
</script>
</h:head>

<ui:composition template="/template/template.xhtml">
<ui:define name="content">
<h:body style="width:100%;height:100%;" onload="loaded()">
     <p class="item">Random text</p>
</h:body>
</ui:define>
</ui:composition>

but when i remove the define and composition tags the loaded function is called. Any idea why this is happening ?

Here is the template file

<!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:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">


<h:head>
<title><ui:insert name="title">Template</ui:insert></title>
</h:head>

<h:body>

<div id="header">
    <ui:insert name="header">
        <ui:include src="../menu.xhtml" />
    </ui:insert>
</div>


<div id="content">
    <ui:insert name="content">
        <ui:include src="../content.xhtml" />
    </ui:insert>
</div>

<div id="footer">
    <ui:insert name="footer">
        This is a footer
    </ui:insert>
</div>

解决方案

Everything outside <ui:composition> is ignored during building the view. Also, redeclaring <h:body> once again is unnecessary. To use a script which runs during on page load, better use a <h:outputScript target="body">. This will be relocated to end of body and thus be invoked after the necessary HTML DOM elements are been built. This is also somewhat faster than an onload.

All with all, your entire content.xhtml must look like this:

<ui:composition template="/template/template.xhtml"
    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"
>
    <ui:define name="content">
        <h:outputScript target="body">
            alert("Working!!");
        </h:outputScript>

        <p class="item">Random text</p>
    </ui:define>
</ui:composition>

See also:

这篇关于Javascript在JSF模板下不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆