http://simonwillison.net/2004/May/26/addLoadEvent/

The addLoadEvent function takes as an argument another function which should be executed once the page has loaded. Unlike assigning directly to window.onload, the function adds the event in such a way that any previously added onload functions will be executed first.

The way this works is relatively simple: if window.onload has not already been assigned a function, the function passed to addLoadEvent is simply assigned to window.onload. If window.onload has already been set, a brand new function is created which first calls the original onload handler, then calls the new handler afterwards.

addLoadEvent has one very important property: it will work even if something has previously been assigned to window.onload without using addLoadEvent itself. This makes it ideal for use in scripts that may be executing along side other scripts that have already been registered to execute once the page has loaded.

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  }
  else {
    window.onload = function() {
      if (oldonload) {
        oldonload();
      }
      func();
    }
  }
}

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad);
addLoadEvent(function() {
  /* more code to run on page load */ 
});

Place the following in the BODY tag.

<script type="text/JavaScript">
<!--
function popupMsg(msg) { //v1.0
  alert(msg);
}
//-->
</script>

onLoad="popupMsg('message here')"

// faster jQuery-based document.onLoad alternative

$(document).ready(function() {
   // put all your jQuery goodness in here.
   });

This script gives the ability to run javascript functions after the page has loaded. I definitely can't take credit for this, as it's one I found, but I use it constantly.

window.onloadListeners=new Array();

window.addOnLoadListener = function (listener) {
	window.onloadListeners[window.onloadListeners.length]=listener;
}

window.onload=function(){
	for(var i=0;i<window.onloadListeners.length;i++){
		func = window.onloadListeners[i];
		func.call();
	}
}

//window.addOnLoadListener(function);

I just prefer this implementation as opposed to window.onload.

Event.observe( window, 'load', function() {
  // Put the Javascript that needs to happen when the page
  // loads here
} );

For example, here's a way to make most of your input fields and all of your textareas have a different class when they're selected. Useful if you want to style them differently with CSS.

Event.observe( window, 'load', function() {
  var inputs = document.getElementsByTagName( 'input' );
  var textareas = document.getElementsByTagName( 'textarea' );

  for ( var i=0; i<inputs.length; i++ ) {
    type = inputs[i].type;

    if (
      ( type == 'button' || type == 'reset' ||
      type == 'password' || type == 'text' ||
      type == 'submit' ) &&
      ( inputs[i].onfocus == '' ||
      !inputs[i].onfocus )
    ) {
      inputs[i].onfocus = function() {
        this.className = 'selected';
      }

      inputs[i].onblur = function() {
        this.className = '';
      }
    }
  }

  for ( var i=0; i<textareas.length; i++ ) {
    if ( textareas[i].onfocus == '' || !textareas[i].onfocus ) {
      textareas[i].onclick = function() {
        this.className = 'selected';
      }
      textareas[i].onblur = function() {
        this.className = '';
      }
    }
  }
} );

from: http://happygiraffe.net/blog/archives/2006/03/05/prototype-and-window-onload


We’ve known for some time that simply assigning to window.onload is bad. Simon Willison created addLoadEvent a long time back to work around the problem. But I’m in Rails, and we have prototype. So what’s the correct idiom?

Well, after a bit of playing, it seems to be this:

  <% content_for("page_scripts") do %>
    Event.observe(window, 'load',
      function() { $('username').focus() }
    );
  <% end %>

I do love that $() function.

This assumes that you have a layout that looks something like this, in order to insert bits of JavaScript into the head.

  <script type="text/javascript">
    <%= @content_for_page_scripts %>
  </script>

Anyway, the solution seems a little more verbose than addLoadEvent(), but not disastrously so.

from http://simon.incutio.com/archive/2004/05/26/addLoadEvent

function addLoadEvent(func) {
  var oldonload = window.onload;
  if (typeof window.onload != 'function') {
    window.onload = func;
  } else {
    window.onload = function() {
      oldonload();
      func();
    }
  }
}

To add an event:

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad);
addLoadEvent(function() {
  /* more code to run on page load */ 
});

Tested on IE 5, 5.5 and 6 for Windows; IE 5 and Safari for Mac; Opera 7.5 and FireFox on Mac. Fails on Opera 6.