i'm having trouble understanding Simon Willison's addLoadEvent()

[Jake Barnes]

I thought I understood this article:

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

It seems like a smart, insightful function:


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

He gives these examples:

addLoadEvent(na meOfSomeFunctio nToRunOnPageLoa d);
addLoadEvent(fu nction() {
/ * more code to run on page load * /
});


Oddly, the first example doesn't work for me at all. I can try

addLoadEvent("c heckForm()");

and:

addLoadEvent("c heckForm");

but the second form works for me just fine:


addLoadEvent(fu nction() {
//Attaching the onSubmit event to the login form
if (document.getEl ementById('cmsf orm')) {
var loginForm = document.getEle mentById('cmsfo rm');
loginForm.onsub mit = function () {
checkFormForEmp tyFields(this);
return false;
}
}
});



However, I want to add an event to several of the event handlers of
this form. Yet when I try, the code stops working, and I get the
amazing error message that loginForm has no properties.

This doesn't work, but I can't imagine why:

addLoadEvent(fu nction() {
//Attaching the onSubmit event to the login form
if (document.getEl ementById('cmsf orm')) {
var loginForm = document.getEle mentById('cmsfo rm');
loginForm.oncli ck = function () {
updateLivePrevi ew(this);
return false;
}
}
});

addLoadEvent(fu nction() {
//Attaching the onSubmit event to the login form
if (document.getEl ementById('cmsf orm')) {
var loginForm = document.getEle mentById('cmsfo rm');
loginForm.onkey down = function () {
updateLivePrevi ew(this);
return false;
}
}
});

addLoadEvent(fu nction() {
//Attaching the onSubmit event to the login form
if (document.getEl ementById('cmsf orm')) {
var loginForm = document.getEle mentById('cmsfo rm');
loginForm.oncha nge = function () {
updateLivePrevi ew(this);
return false;
}
}
});

addLoadEvent(fu nction() {
//Attaching the onSubmit event to the login form
if (document.getEl ementById('cmsf orm')) {
var loginForm = document.getEle mentById('cmsfo rm');
loginForm.onblu r = function () {
updateLivePrevi ew(this);
return false;
}
}
});


Why is that?

[Janwillem Borleffs]

Re: i'm having trouble understanding Simon Willison's addLoadEvent()

Jake Barnes wrote:[color=blue]
> Oddly, the first example doesn't work for me at all. I can try
>
> addLoadEvent("c heckForm()");
>
> and:
>
> addLoadEvent("c heckForm");
>[/color]

Try: addLoadEvent(ch eckForm); (which passes the actual function reference,
not a string)


JW

[Jake Barnes]

Re: i'm having trouble understanding Simon Willison's addLoadEvent()


Janwillem Borleffs wrote:[color=blue]
> Jake Barnes wrote:[color=green]
> > Oddly, the first example doesn't work for me at all. I can try
> >
> > addLoadEvent("c heckForm()");
> >
> > and:
> >
> > addLoadEvent("c heckForm");
> >[/color]
>
> Try: addLoadEvent(ch eckForm); (which passes the actual function reference,
> not a string)[/color]

Thanks much. I guess if I'd been thinking clearly I would have realized
the parameter has to be function, not a string.

Any idea why this code would fail if I try to override two event
handlers on one page element? This works fine:

addLoadEvent(fu nction() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePrevi ew(this);
return false;
}
});


but this does not:


addLoadEvent(fu nction() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePrevi ew(this);
return false;
}
});

addLoadEvent(fu nction() {
var refToBody = document.body;
refToBody .onblur= function () {
updateLivePrevi ew(this);
return false;
}
});

[Thomas 'PointedEars' Lahn]

Re: i'm having trouble understanding Simon Willison's addLoadEvent()

Jake Barnes wrote:
[color=blue]
> Any idea why this code would fail if I try to override two event
> handlers on one page element? This works fine:
>
> addLoadEvent(fu nction() {
> var refToBody = document.body;
> refToBody .onclick= function () {
> updateLivePrevi ew(this);
> return false;
> }
> });
>
>
> but this does not:
>
> addLoadEvent(fu nction() {
> var refToBody = document.body;
> refToBody .onclick= function () {
> updateLivePrevi ew(this);
> return false;
> }
> });
>
> addLoadEvent(fu nction() {
> var refToBody = document.body;
> refToBody .onblur= function () {
> updateLivePrevi ew(this);
> return false;
> }
> });[/color]

<URL:http://www.jibbering.c om/faq/faq_notes/pots1.html#ps1D ontWork>
<URL:http://jibbering.com/faq/#FAQ4_43>

BTW, the `refToBody' variable is redundant.


PointedEars
--
There are two possibilities: Either we are alone in the
universe or we are not. Both are equally terrifying.
-- Arthur C. Clarke