简体   繁体   中英

How To Use Timing events using JavaScript to Show Then Hide a Message?

I want to display "hello" message for 3 minutes and after that it should be vanished. I want to handle onLoad event of JavaScript. The following is the code that I had tried with onClick because I don't know how to handle onLoad . Please give me correct code.

<html>
    <head>
        <script type="text/javascript">
              function timeMsg()
              {
                     var t=setTimeout("alertMsg()",3000);
              }
              function alertMsg()
              {
                     document.write("Hello");
              }
        </script>
    </head>
    <body>
        <form>
            <input type="button" value="Display alert box onClick="timeMsg()"/>
        </form>
    </body>
</html>

You want to show the message first, then start your setTimeout timer with the duration for when you want your "hide" event to fire. Time is also measured in milliseconds, so 60000ms is 60 seconds(1 minute), and 180000ms is 3 minutes.

 <script type="text/javascript">
    function showMessage() {
        document.getElementById("container").innerHTML = "hello!";
        setTimeout(function() {
            document.getElementById("container").innerHTML = "";
        },180000);
    }
  </script>
</head>

<body onload="showMessage()">
    <div id="container"></div>
</body>  

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

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