javascript - 无法使用 JavaScript 隐藏 HTML div

Question

我有一个带有以下登录表单代码的 JSP:

<c:if test="${requestScope.loginFailed == true}">
    <script>
        show('login-failed');
    </script>
</c:if>
<c:if test="${sessionScope.userLoggedIn == true}">
    <script>
        show('welcome');
        hide('login-table');
    </script>
</c:if>

<div id="welcome" style="display: none;">
    <p style="color: green">Welcome ${sessionScope.user.userName}</p>
</div>

<div id="login-failed" style="display: none;">
    <p style="color: red">Invalid UserName/Password!</p>
</div>

<div id="login">
.........................
....actual login form....
.........................
</div>

在我编写的 JavaScript 代码中

function show(id) {
    document.getElementById(id).style.display = 'block';
}

function hide(id) {
    document.getElementById(id).style.display = 'none';
}

但是，即使用户登录并且 userLoggedIn属性位于 sessionScope 中即使 <c:if>测试成功，如果我无法隐藏 login分区谁能指导我？

Answer 1

show 和 hide 函数在它们影响的元素之前被调用。

您应该将脚本移动到这些元素之后(更简单)，或者将它们的执行推迟到页面末尾(稍微复杂一些，但通常被认为“更正确”)。