[jQuery] Catch a click event before the DOM is loaded
I've recently been working on a project where the page is complex
enough that the DOM would not have loaded before the user had spotted
our 'big red button' - and clicked away.
As much as I hate to admit, this project wasn't going to support a non-
JS version (due to the demographic), so I thought I'd share how we
solved the problem of early clicks.
I have a full write up here:
http://remysharp.com/2007/10/01/catch-click-events-before-the-dom-is-loaded/
In short: add an explicit click handler on the link/s in question
returning the value from the following function:
<code>
function earlyClickHandler() {
var t = this;
if (typeof $.isReady == 'boolean' && $.isReady) {
return true;
} else if (!t.clicked){
t.clicked = true;
// once DOM is loaded, fire this click handler
$(function () {
$(t).click();
});
}
return false;
}
</code>
I'm an advocate for unobtrusive JavaScript, but sometimes you have to
work with what you've got.
I'd welcome any feedback.
Cheers, Remy.