Simple Javascript not working: <div onload="alert("Hi");" > [duplicate]

StackOverflow https://stackoverflow.com/questions/22159476

  •  19-10-2022
  •  | 
  •  

Question

I'm trying to get a really simple to alert() to pop up as soon as a div loads. Unfortunately it is not working, and I can't figure out why.

Here is the code:

<html>
    <head>
        <title>My Site</title>
        <link rel="stylesheet" type="text/css" href="style2.css">
        <script type="text/javascript" src="js/jquery_1.4.2.js"></script>
        <script type="text/javascript" src="js/alertjs.js"></script>
    </head>
    <body>
        <div id="background_logo" onload="pop_alert();">
            <img src="mysiteLogo.png">
        </div>
        <div id="signup">
            <p id="instruction"> Get on board! </br> Enter your email to receive updates:</p>
            <script type="text/javascript" src="js/form-validation.js"></script>

        </div>
    </body>


</html>

And the JavaScript is just this:

function pop_alert(){
    alert("This is an alert");
}
Était-ce utile?

La solution 2

You can't attach onload to a div. Try putting it in the <body>:

<body onload="pop_alert();">

Autres conseils

It cannot be used for div tags. This is the following list it can be used on:

<body>, <frame>, <frameset>, <iframe>, <img>, <input type="image">, 
<link>, <script>, <style>

You can't use onload on a div. The best way to do this is to add a script element after the div to run the function.

<html>
    <head>
        <title>My Site</title>
        <link rel="stylesheet" type="text/css" href="style2.css">
        <script type="text/javascript" src="js/jquery_1.4.2.js"></script>
        <script type="text/javascript" src="js/alertjs.js"></script>
    </head>
    <body>
        <div id="background_logo">
            <img src="mysiteLogo.png">
        </div>
        <script>
            pop_alert();
        </script>
        <div id="signup">
            <p id="instruction"> Get on board! </br> Enter your email to receive updates:</p>
            <script type="text/javascript" src="js/form-validation.js"></script>

        </div>
    </body>


</html>

See How to add onload event to a div element?

OnLoad is used on body or windows not the div etc. If you want then use event handler to alert the pop up for example assign some id and use that to bind the event.

That is because onload is a document(body) event.

demo: http://jsbin.com/benosofo/1/

The onload event can only be used on the document(body) itself, frames, images, and scripts. In other words, it can be attached to only body and/or each external resource. The div is not an external resource and it's loaded as part of the body, so the onload event doesn't apply there.

from: https://stackoverflow.com/a/4057251/2213706

onload is fired when the browser has loaded all content (including images, script files, CSS files, etc.)

http://www.w3schools.com/jsref/event_onload.asp

Poor source I know.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top