Home Library Learn Downloads Support Community
Sign in | United States - English | |
12 out of 18 rated this helpful Rate this topic

onload Event

.NET Framework 3.0

Fires immediately after the client loads the object.

Syntax

Inline HTML <ELEMENT onload = "handler(event);" >
Event Property object.onload = handler;
DOM Events object.addEventListener( "load", handler, bCapture); Internet Explorer 9 New for Windows Internet Explorer 9 
attachEvent object.attachEvent( "onload", handler); Internet Explorer only

Event Information

Bubbles No
Cancels No
To invoke Open a document to invoke this event for the document or any object within it.
Default action Loads the object for which the event is specified.

Event Object Properties

 New for Internet Explorer 9  In Internet Explorer 9, the type of event object depends on whether you use attachEvent or addEventListener to register the event handler. If you register the handler with addEventListener, an object of type Event is passed during the event. If you use attachEvent, the legacy event object is passed instead.

Refer to the specific event object for additional event properties.

Remarks

The client loads applications, embedded objects, and images as soon as it encounters the applet, embed, and img objects during parsing. Consequently, the onload event for these objects occurs before the client parses any subsequent objects. To ensure that an event handler receives the onload event for these objects, place the script object that defines the event handler before the object and use the onload attribute in the object to set the handler.

The onload attribute of the body object sets an onload event handler for the window. This technique of calling the window onload event through the body object is overridden by any other means of invoking the window onload event, provided the handlers are in the same script language.

Example

The following example shows how to declare an onload event for a document that is designed to work with multiple browsers and earlier versions of Internet Explorer.

Copy 

<!doctype html>
<head>
  <title>Load Event Sample</title>

  <script type="text/javascript">
  function doLoad() {
     alert( "The load event is executing" );
  }

  if ( window.addEventListener ) { 
     window.addEventListener( "load", doLoad, false );
  }
  else 
     if ( window.attachEvent ) { 
        window.attachEvent( "onload", doLoad );
  } else 
        if ( window.onLoad ) {
           window.onload = doLoad;
  }
  </script>

</head>

<body>
  <h1>Load Event Sample</h1>
  <p>This sample demonstrates how to execute 
     an event while the document is loading.</p>
</body>
</html>

Standards Information

This event is defined in HTML 4.0.

Applies To

A, ABBR, ACRONYM, ADDRESS, APPLET, AREA, AUDIO, B, BASE, BASEFONT, BDO, BGSOUND, BIG, BODY, BLOCKQUOTE, BR, BUTTON, CANVAS, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, COMMENT, CUSTOM, DD, DEL, DFN, DIR, DIV, DL, document, DT, EM, EMBED, FIELDSET, FONT, FORM, FRAME, FRAMESET, HEAD, hn, HR, HTML, I, IFRAME, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=hidden, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, INS, ISINDEX, KBD, LABEL, LEGEND, LI, LINK, LISTING, MAP, MARQUEE, MEDIA, MENU, META, nextID, NOBR, NOFRAMES, NOSCRIPT, OBJECT, OL, OPTGROUP, OPTION, P, PARAM, PLAINTEXT, PRE, Q, RT, RUBY, S, SAMP, SCRIPT, SELECT, SMALL, SOURCE, SPAN, STRIKE, STRONG, STYLE, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TITLE, TR, TT, U, UL, VAR, WBR, VIDEO, window, XMP, HTMLBodyElement Constructor, Element Constructor, HTMLEmbedElement Constructor, HTMLFrameElement Constructor, HTMLFrameSetElement Constructor, HTMLIFrameElement Constructor, HTMLImageElement Constructor, HTMLInputElement Constructor, HTMLLinkElement Constructor, HTMLScriptElement Constructor, HTMLStyleElement Constructor, HTMLDocument Constructor, Window Constructor

See Also

Did you find this helpful?
(2000 characters remaining)
Community Content Add
Annotations FAQ
The handler must not be named "onload"!

The following code has no effect in IE8:

window. onload = function onload () { alert ("Loaded.") }

 

History
IE9, Vista gadget, body onload fails if called function is in a separate file

With Internet Explorer 9, in a Vista gadget when Disable Script Debug (Internet Explorer) and Disable Script Debug (Other) are both checked,  <body onload="doFunction();"> does not work if doFunction() is in a  separate file. If Disable Script Debug (Other) is unchecked and Disable Script Debug (Internet Explorer) is checked it works and also works when both are unchecked.

It always worked in IE8 and previous.

SOLUTION:
This happen only if the javascript files are saved in Unicode without BOM. Saving as Ansi or UTF-8 is all right, Also Unicode with BOM is all right.

 

History
SOLUTION: set the onload before you set the src
I was confronted with the same problem and spent a day finding a good solution or workaround. Finally I found a solution which worked perfectly using google. The problem is in the order of calling the image.onload and image.src

You need to set the image.onload before you set the image.src. This has to do with the fact that an image that is already in the cache of the browser wil load immediately after setting the image source (thus before the onload event handler is even set), resulting in the onload event handler never to be called at all.

Hope some people are helped by my post

History
WARNING!!!

For dynamically created img objects, the onload event only fires up if the source file is downloaded form the web server. When the file is already stored on the Internet Explorer's (7) cache, the onload event is never triggered. It seems like there is no work arround for this problem, since the onreadystatechange also fails to trigger when the file already exists on the browser's cache. I don't know if this also happens in IE8, but I do know this only happens with Internet Explorer.

History
Limitation - window onload fails body resize 
<SCRIPT for=window EVENT=onload>
alert(obodyid.fireEvent("onresize"));
</SCRIPT>


--fails to fire the body-onresize-event, even though it alerts True.

History