469,352 Members | 2,140 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,352 developers. It's quick & easy.

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

I thought I understood this article:

http://simon.incutio.com/archive/200...6/addLoadEvent

It seems like a smart, insightful function:
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}
}

He gives these examples:

addLoadEvent(nameOfSomeFunctionToRunOnPageLoad);
addLoadEvent(function() {
/ * more code to run on page load * /
});
Oddly, the first example doesn't work for me at all. I can try

addLoadEvent("checkForm()");

and:

addLoadEvent("checkForm");

but the second form works for me just fine:
addLoadEvent(function() {
//Attaching the onSubmit event to the login form
if (document.getElementById('cmsform')) {
var loginForm = document.getElementById('cmsform');
loginForm.onsubmit = function () {
checkFormForEmptyFields(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(function() {
//Attaching the onSubmit event to the login form
if (document.getElementById('cmsform')) {
var loginForm = document.getElementById('cmsform');
loginForm.onclick = function () {
updateLivePreview(this);
return false;
}
}
});

addLoadEvent(function() {
//Attaching the onSubmit event to the login form
if (document.getElementById('cmsform')) {
var loginForm = document.getElementById('cmsform');
loginForm.onkeydown = function () {
updateLivePreview(this);
return false;
}
}
});

addLoadEvent(function() {
//Attaching the onSubmit event to the login form
if (document.getElementById('cmsform')) {
var loginForm = document.getElementById('cmsform');
loginForm.onchange = function () {
updateLivePreview(this);
return false;
}
}
});

addLoadEvent(function() {
//Attaching the onSubmit event to the login form
if (document.getElementById('cmsform')) {
var loginForm = document.getElementById('cmsform');
loginForm.onblur = function () {
updateLivePreview(this);
return false;
}
}
});
Why is that?

May 18 '06 #1
3 5256
Jake Barnes wrote:
Oddly, the first example doesn't work for me at all. I can try

addLoadEvent("checkForm()");

and:

addLoadEvent("checkForm");


Try: addLoadEvent(checkForm); (which passes the actual function reference,
not a string)
JW
May 18 '06 #2

Janwillem Borleffs wrote:
Jake Barnes wrote:
Oddly, the first example doesn't work for me at all. I can try

addLoadEvent("checkForm()");

and:

addLoadEvent("checkForm");


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


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(function() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePreview(this);
return false;
}
});
but this does not:
addLoadEvent(function() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePreview(this);
return false;
}
});

addLoadEvent(function() {
var refToBody = document.body;
refToBody .onblur= function () {
updateLivePreview(this);
return false;
}
});

May 18 '06 #3
Jake Barnes wrote:
Any idea why this code would fail if I try to override two event
handlers on one page element? This works fine:

addLoadEvent(function() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePreview(this);
return false;
}
});
but this does not:

addLoadEvent(function() {
var refToBody = document.body;
refToBody .onclick= function () {
updateLivePreview(this);
return false;
}
});

addLoadEvent(function() {
var refToBody = document.body;
refToBody .onblur= function () {
updateLivePreview(this);
return false;
}
});


<URL:http://www.jibbering.com/faq/faq_notes/pots1.html#ps1DontWork>
<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
May 24 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

19 posts views Thread by Svennglenn | last post: by
14 posts views Thread by Joseph | last post: by
7 posts views Thread by | last post: by
5 posts views Thread by Krumble Bunk | last post: by
18 posts views Thread by Simon | last post: by
4 posts views Thread by John Salerno | last post: by
11 posts views Thread by KraftDiner | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.