如何在RichFaces/JSF页面中嵌入和调用javascript脚本

Question

我一直在寻找一种在JSF页面中嵌入和调用javascript函数的方法.我也在使用RichFaces.

要定义该功能,似乎我可以跨浏览器支持的方式执行此操作:

        <a4j:outputPanel ajaxRendered="true">
        <f:verbatim>
            <script type="text/javascript">
                function datum() {
                    alert("hi");
                }
            </script>
        </f:verbatim>
    </a4j:outputPanel>

但我不确定如何在页面加载时调用此函数,以便返回的文本嵌入到h:outputPanel.计划是在页面中嵌入一个js时钟,然后提供给客户端.注意我没有使用body标签,我正在使用facelets ui:composition,f:view(core)和RF RI rich:page.

谢谢

Answer 1

无论您使用何种类型的服务器端标签,当您的页面到达浏览器时都会消失,而且只是HTML.(至少,它最好是,或者事情无论如何都不会工作.)你需要做的是安排你的代码被"加载"事件处理程序调用.有很多方法可以做到这一点,但最简单的方法是:

 <f:verbatim>
     <script type="text/javascript">
        window.onload = function() {
            alert("hi");
        }
    </script>
</f:verbatim>

现在,为了初始化页面的另一部分,重要的是HTML中的最终结果.您可能希望安排某种HTML容器(一种<div>或多种东西,具体取决于您的页面设计),并且您希望它具有唯一的"id"属性.然后,您的Javascript可以使用"id"来查找元素并设置其内容:

    var elem = document.getElementById("whatever");
    elem.innerHTML = // ... whatever ;

您可能在"加载"功能中执行此操作.

此外,如果您使用Facelets而不是JSP(这是一个基于XML的视图技术),如果您的JavaScript包含注释//或文字(如<,>,&&等),则需要添加XML CDATA部分分隔符.这里是XML CDATA分隔符的示例:

 <f:verbatim>
     <script type="text/javascript">
     //<![CDATA[
        //Comments won't show error now.
        window.onload = function() {
            alert("hi");
        }
    //]]>
    </script>
</f:verbatim>

您可以在此处查看何时使用CDATA的详细说明. 如果您正在创建HTML5页面,则不需要这些.

快乐的编码!