简体   繁体   English

为什么函数没被调用?

[英]why the function is not being called?

I am testing a thing based upon the URL . 我正在根据URL测试一个东西。 If the URL ends with logout.jsp then the logout message should get displayed and if URL ends with index.jsp the message should not get displayed . 如果URL以logout.jsp结尾,则应显示注销消息,如果URL以index.jsp结尾,则不应显示该消息。 For doing this I used document.getElementById("id").hidden = value . 为此,我使用了document.getElementById("id").hidden = value But this doesn't work.Infact the function is not being called. 但这不起作用。实际上函数没有被调用。 I don't know what the problem is. 我不知道问题是什么。

HTML snippet HTML片段

<table id="LogoutMessage" onload="urlCheck()">
            <tr>
                <td>
                    <h2>You are successfully logged out !</h2>
                </td>
            </tr>
        </table>

javascript function javascript函数

<script type="text/javascript">
    function urlCheck() {
        alert("in the function urlCheck");
        if(document.URL.endsWith() = "logout.jsp")
            document.getElementById("LogoutMessage").hidden = false;
        else if(document.URL.endsWith() = "index.jsp")
            document.getElementById("LogoutMessage").hidden = true;                
    }
</script>

Whole page In JSP 整页 在JSP中

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>PhotoArtWork</title>
    <jsp:include page="reusable/stylesheets.html" />
    <script type="text/javascript" src="js/modernizr-1.5.min.js"></script>
</head>
<body>
    <jsp:include page="reusable/header.html" />
    <!-- begin content --><div id="site_content">
        <table id="LogoutMessage" onload="urlCheck()">
            <tr>
                <td>
                    <h2>You are successfully logged out !</h2>
                </td>
            </tr>
        </table>
  <ul class="slideshow">
    <li class="show"><img width="950" height="450" src="images/home_1.jpg" alt="&quot;You can put a caption for your image right here&quot;"></li>
    <li><img width="950" height="450" src="images/home_2.jpg" alt="&quot;You can put a description of the image here if you like, or anything else if you want.&quot;"></li>
    <li><img width="950" height="450" src="images/home_3.jpg" alt="&quot;You can put a description of the image here if you like, or anything else if you want.&quot;"></li>

  </ul>
  </div>
<!-- end content -->
<script type="text/javascript">
    function urlCheck() {
        alert("in the function urlCheck");
        if(document.URL.endsWith() = "logout.jsp")
            document.getElementById("LogoutMessage").hidden = false;
        else if(document.URL.endsWith() = "index.jsp")
            document.getElementById("LogoutMessage").hidden = true;                
    }
</script>
<jsp:include page="reusable/footer.html" />
</body>
</html>

What is the problem ? 问题是什么 ?

There is no .hidden attribute. 没有.hidden属性。 It is part of the element's style and you would use visibility. 它是元素风格的一部分,您可以使用可见性。

document.getElementById("LogoutMessage").style.visibility = "hidden"; // or "visible"

And if I had to guess, you want to use display and not hidden . 如果我不得不猜测,你想使用display而不是hidden

document.getElementById("LogoutMessage").style.display = "none"; // or "block"

To have your code called, either do: 要调用您的代码,请执行以下操作:

<body onload="urlCheck()">

or put the script at the very end of the body tag, with just the inner code of your function. 或者将脚本放在body标签的最末端,只使用函数的内部代码。

Javascript doesn't have a native endsWith . Javascript没有本机endsWith So you have to create one first 所以你必须先创建一个

String.prototype.endsWith = function(suffix) {
    return this.indexOf(suffix, this.length - suffix.length) !== -1;
};

Also, there is no style.hidden property . 此外,没有 style.hidden property Please use style.display instead 请改用style.display

Thecorrect function urlCheck should be like this 正确的功能urlCheck应该是这样的

function urlCheck() {
    alert("in the function urlCheck");
    if(document.URL.endsWith("logout.jsp"))
        document.getElementById("LogoutMessage").style.display= 'block';
    else if(document.URL.endsWith("index.jsp"))
        document.getElementById("LogoutMessage").style.display= 'none';
}

Oh and as Mic says please call the function onload like this. 哦,正如Mic所说,请像这样调用函数onload。

window.onload = function() { urlCheck(); }

You can use jQuery. 你可以使用jQuery。 Include 包括

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

and use 并使用

$('#LogoutMessage').hide();

for hiding the message and 用于隐藏消息和

$('#LogoutMessage').show();

for showing the message 用于显示消息

To call your function 打电话给你的功能

$(document).ready(function(){
    urlCheck();
})
function urlCheck() {
    var url = document.URL;
    var urlArr = url.split('/')
    if($.inArray('logout.jsp', urlArr))
    {
        $('#LogoutMessage').show();
    }
    if($.inArray('index.jsp', urlArr))
    {
        $('#LogoutMessage').hide();
    }
}

Try the above . 试试以上。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM