Fatal编程技术网
  • javascript/
  • Javascript 在JSF的子视图页面中，onload脚本不起作用

Javascript 在JSF的子视图页面中，onload脚本不起作用

javascript jsp jsf

Javascript 在JSF的子视图页面中，onload脚本不起作用,javascript,jsp,jsf,onload,Javascript,Jsp,Jsf,Onload,我已经编写了两个JSP页面：outerPage.JSP和innerPage.JSP outerPage.jsp包括innerPage.jsp innerPage.jsp有一个文本字段和一个按钮 当页面加载时，我需要将焦点设置在innerPage.jsp中的textfield上。 我编写了JavaScript，它在outerPage.jsp的body-onload过程中被调用，但它不起作用 以下是outerPage.jsp： <%@page contentType="text/html" p

我已经编写了两个JSP页面：
outerPage.JSP
和
innerPage.JSP

outerPage.jsp
包括
innerPage.jsp

innerPage.jsp
有一个文本字段和一个按钮

当页面加载时，我需要将焦点设置在
innerPage.jsp
中的textfield上。
我编写了JavaScript，它在
outerPage.jsp
的body-onload过程中被调用，但它不起作用

以下是
outerPage.jsp
：

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>    

<html>
    <f:view>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>Outer Viewer</title>
            <meta name="description" content="Outer Viewer" />                    
        </head>
        <body id="outerMainBody">
            <rich:page id="richPage">                             
                <rich:layout>
                    <rich:layoutPanel position="center" width="100*">
                        <a4j:outputPanel>
                            <f:verbatim><table style="padding: 5px;"><tbody><tr>
                                            <td>
                                               <jsp:include page="innerPage.jsp" flush="true"/>      
                                            </td>
                                        </tr></tbody></table></f:verbatim>
                                </a4j:outputPanel>
                            </rich:layoutPanel>
                        </rich:layout>
                    </rich:page>
        </body>
    </f:view>
</html>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>   

<f:verbatim><html></f:verbatim>
    <f:subview id="innerViewerSubviewId">
        <f:verbatim><head>
                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
                <title>Inner Viewer </title>               
                <script type="text/javascript">
//This script does not called during the page loading (onload)       
                    function cursorFocus() 

                    {
                        alert("Cursor Focuse Method called...");                
                        document.getElementById("innerViewerForm:innerNameField").focus();
                        alert("Cursor Focuse method end!!!");
                    }               
                </script>
            </head>
            <body onload="cursorFocus();"></f:verbatim>

            <h:form id="innerViewerForm">
                <rich:panel id="innerViewerRichPanel">

                    <f:facet name="header">
                        <h:outputText value="Inner Viewer" />
                    </f:facet>

                    <a4j:outputPanel id="innerViewerOutputPanel" >

                        <h:panelGrid id="innerViewerSearchGrid" columns="2" cellpadding="3" cellspacing="3">

                             //<%-- Row 1 For Text Field --%>
                     <h:outputText value="inner Name : " />
                     <h:inputText id="innerNameField" value=""/>                           

                     //<%--  Row 2 For Test Button --%>
                     <h:outputText value="" />
                     <h:commandButton  value="TestButton" action="test" />

                    </h:panelGrid>                                             

                    </a4j:outputPanel>
                </rich:panel>
            </h:form>           
            <f:verbatim></body></f:verbatim>
    </f:subview>
    <f:verbatim></html></f:verbatim>
未调用
cursorFocus（）
脚本

提前感谢。

当您遇到此类问题时

只需在标记之前调用页面末尾的脚本

您的身体标签将更改为

...content above body
<body>
...content inside body
<script type="text/javascript">cursorFocus();</script>
</body>
...content after body

…正文上方的内容
…体内的内容
游标焦点（）；
…正文后的内容
您的HTML在语法上无效。生成的HTML输出必须如下所示：

<!doctype declaration>
<html>
    <head>...</head>
    <body>...</body>
</html>

innerPage.jsp

<!doctype declaration>
<f:view>
    <html>
        <head>
            <title>...</title>
            <meta>...</meta>
            <script>...</script>
        </head>
        <body>
            <jsp:include />
        </body>
    </html>
</f:view>

<f:subview>
    <h:form>
        <h:inputText />
    </h:form>
</f:subview>
一旦对齐了所有HTML，就可以专注于JavaScript函数的功能了。在生成的HTML源（在webbrowser中右键单击页面，查看源代码）中检查
元素的生成客户端ID，然后在
文档中使用它。getElementById（）
您缺少脚本的子视图ID：

              function cursorFocus() 
               {
                    alert("Cursor Focuse Method called...");                
                    document.getElementById("innerViewerForm:innerNameField").focus();
                    alert("Cursor Focuse method end!!!");
                }               
            </script>
}

实际上，我在发帖时错过了那个标签。但是我已经使用了所有的语法。我使用netbeanside。所以不可能错过这一点。。对不起，我在威尼斯的帖子。请更新你的问题，包括实际代码。要正确设置格式，只需将其缩进4个空格，或者选择它，然后按编辑器工具栏中的
010101
按钮或
Ctrl+K
键。否则HTML标记将消失。编辑邮件时，请参见右侧栏中的邮件格式规则。您的代码仍然无效。你看过我的答案了吗？它不仅仅是双
条目。更重要的是。我已经更新了我的答案以反映您的问题更新。好的。谢谢你的努力。现在它成功了。eswaramoorthy nec给出的答案。我没有找到子视图id。正确的行是：document.getElementById（“innerViewerSubviewId:InnerViewPerform:innerNameField”）.focus（）；有一件事我想明白。。javascript是从上到下执行的吗？是的。但是，您可以定义java脚本函数，并且可以在定义之后按任意顺序调用它们。它们将按调用的顺序执行。 
<!doctype declaration>
<html>
    <head>
        <title>...</title>
        <meta>...</meta>
        <script>...</script>
    </head>
    <body>
        <form>
            <input type="text" />
        </form>
    </body>
</html>

              function cursorFocus() 
               {
                    alert("Cursor Focuse Method called...");                
                    document.getElementById("innerViewerForm:innerNameField").focus();
                    alert("Cursor Focuse method end!!!");
                }               
            </script>

document.getElementById("innerViewerSubviewId:innerViewerForm:innerNameField").focus();