无法在 Sitemesh 的 <body> 中执行 body onload 功能答案

【问题标题】：Cannot execute body onload function in <body> from Sitemesh无法在 Sitemesh 的 <body> 中执行 body onload 功能
【发布时间】：2015-01-25 17:29:44
【问题描述】：

我正在尝试创建一个简单的应用程序，其中包含用于装饰结果页面的 Sitemesh。

以下是我正在尝试创建的简单页面。

<%@ include file="/WEB-INF/jsp/include.jsp" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <html>
    <head>
        <title>Creating a simple map</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAXWLpztTcGIDURBKce345XdXtfws5guEs"></script>
        <script type="text/javascript" src="<c:url value=" /resources/js/keydragzoom_packed.js " />"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

        <script type="text/javascript">
            function init() {
                alert("hi");
            }
        </script>

        <style>
            html,
            body {
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }
        </style>
    </head>

    <body onLoad="init();">
        <h1>Smart Farm Application</h1>
        <p>Time right now is :
            <c:out value="${now}" />
        </p>
        <table border="1" style="width: 1000px; height: 800px;">
            <tr>
                <th>Google Map API</th>
                <th>Google Chart Section</th>
            </tr>
            <tr>
                <td rowspan="2">
                    <div id="google_map_area" style="width: 500px; height: 800px;"></div>
                </td>
                <td>
                    <div id="scatter_chart_area" style="width: 500px; height: 400px;"></div>
                </td>
            </tr>
        </table>
    </body>
    </html>

以下是装饰器页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
    <%@page contentType="text/html; charset=UTF-8" %>
        <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

        <head>
            <title>https://bharatonjava.wordpress.com |
                <decorator:title default="Sitemesh Example" />
            </title>
            <link rel="stylesheet" type="text/css" src="<c:url value=" /resources/assets/css/style.css " />">
            <decorator:head />
        </head>
        <body>
            <table class="mainTable" id="page-container" cellpadding="5" cellspacing="0" border="1" align="center">
                <tr>
                    <td colspan="2" id="page-header">
                        <%@ include file="/WEB-INF/includes/header.jsp" %>
                    </td>
                </tr>
                <tr>
                    <td id="nav-container" colspan="2">
                        <%@ include file="/WEB-INF/includes/navigation.jsp" %>
                    </td>
                </tr>
                <tr>
                    <td id="left-nav-container">
                        <%@ include file="/WEB-INF/includes/navigationLeft.jsp" %>
                    </td>
                    <td id="content-container">
                        <decorator:body onLoad="<decorator:getProperty property='body.onLoad' />">
                        </decorator:body>
                    </td>
                </tr>
                <tr>
                    <td colspan="2" id="page-footer">
                        <%@ include file="/WEB-INF/includes/footer.jsp" %>
                    </td>
                </tr>
            </table>
            <table align="center">
                <tr>
                    <td align="center">
                        <br /><a href='https://test.com'>test</a>
                    </td>
                </tr>
            </table>
        </body>
        </html>

然而，这根本没有得到装饰。当我从浏览器请求页面时，我看到以下错误：

java.lang.RuntimeException: org.apache.jasper.JasperException: /WEB-INF/decorators/layout.jsp(37,12) Attribute onLoad invalid for tag body according to TLD
    com.opensymphony.sitemesh.webapp.decorator.BaseWebAppDecorator.render(BaseWebAppDecorator.java:39)
    com.opensymphony.sitemesh.webapp.SiteMeshFilter.doFilter(SiteMeshFilter.java:84)

我不知道上面的代码哪里错了。我花了几个小时试图弄清楚这一点，而无需去任何地方。有没有人遇到过这种情况？

【问题讨论】：

你试过onload="init();"而不是camelCase'ing (onLoad)吗？还可以尝试右键单击页面到inspect element（在 Safari / Chrome 中）以查看页面实际生成的代码（而不是查看源代码，仅在运行时显示代码）以查看 SiteMesh 是否搞砸了一些东西

标签： javascript onload sitemesh document-body

【解决方案1】：

实际上是onload="init();" 而不是onLoad="init();"，这就是引发异常的原因，看看onload Event。

或者你可以试试这个：

window.addEventListener("load", init, false);

或者

body.addEventListener("load", init, false);

更多信息请访问element.addEventListener。

【讨论】：

感谢您的回复，onload 仍然无法正常工作。但是 window.addEventListener("load", init, false);几乎可以工作，在 addEventListener 之后还会弹出其他错误，例如，1）无法读取 null 的属性“offsetWidth”。如果我们在渲染 div 之前尝试运行 JavaScript，通常会发生这种情况。我正在尝试在 JavaScript 部分初始化谷歌地图..关于如何解决这个问题的任何想法？