[jQuery] Thickbox/JQuery and Firefox not working
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html;charset=ISO-8859-1" http-equiv="Content-Type">
<title></title>
</head>
<body bgcolor="#ffffff" text="#000000">
Hi there all! I'm Dave Reid and I'm trying to solve a problem between
the Thickbox WordPress plugin (and the included JQuery script) and the
Performancing Metrics tracking JavaScript. The Metrics code has a
link-tracking function that saves onclick functions into a oldonclick
event, then calls that function when the link is clicked. This is
somehow interfering with JQuery (and Thickbox) in Firefox (it works
fine in IE). When the Metrics script is disabled, the Thickbox script
works fine. In Firefox with the Metrics script enabled, when I click on
a Thickbox-enabled image, it goes directly to the image and has the
following error in the JavaScript console:
<pre>Error: event has no properties
Source File: <a class="linkification-ext"
href="http://davereid.net/blog/wp-content/plugins/thickbox/jquery.js"
title="Linkification: http://davereid.net/blog/wp-content/plugins/thickbox/jquery.js">http://localhost/blog/wp-content/plugins/thickbox/jquery.js</a>
Line: 723</pre>
When I click the back button and try it again with the same image, it
works. This is reproduced every time when the Metrics script is enabled.
The relevant code in the Metrics script is the following:
<blockquote>
<pre>function z_init() {
...
if (document.links) {
var x;
var link;
var links = document.links;
for (x = 0; x < links.length; x++) {
link = links[x];
// save old onclick, if any
if (link.onclick) {
link.oldonclick = link.onclick;
}
link.onclick = z_linkonclick;
}
}
...
}
function z_linkonclick () {
var link = this;
// check for old handler
if (link.oldonclick) {
// check if function
if (typeof (link.oldonclick) == 'function') {
// execute function, if false cancel (undefined is treated as true by the browser)
if (link.oldonclick () == false) {
return false;
}
}
}
z_tracklink (link.href, false);
return true;
//don't do this because it breaks open in a new window or tab
//hopefully firefox will eventually be fixed to load my img.src before it navigates to a new page
//follow this link in 100ms so that image source is processed
//window.setTimeout('document.location="' + link.href + '"', 100);
//return false;
}
</pre>
</blockquote>
If I comment the line link.onclick = z_linkonclick in the z_init
function, the thickbox script works just fine. There doesn't seem to be
anything logically wrong with this Metrics script, but the JQuery is
frankly a bastard to understand or debug. Basically, I've narrowed it
down to this: the following code in the thickbox.js never executes when
the page first loads, but it executes when a link is clicked, then the
page is loaded via the back button (aka loaded from the Firefox memory)
<blockquote>
<pre>$(document).ready(function(){//when the document is loaded
$("a.thickbox").click(function(){
var t = this.title || this.innerHTML || this.href;
TB_show(t,this.href);
this.blur();
return false;
});
});
</pre>
</blockquote>
It is also interesting to note that when I inserted a few alert
debugging messages in the jquery.js, it worked fine! Just changing the
$.ready function with one alert made the whole thing work.
<blockquote>
<pre>$.ready = function() {
<b>alert('$.ready');</b>
if ( $.$$timer ) {
clearInterval( $.$$timer );
$.$$timer = null;
for ( var i = 0; i < $.$$ready.length; i++ )
$.apply( document, $.$$ready[i] );
$.$$ready = null;
}
};
</pre>
</blockquote>
Something seems wrong and I hope you can help me figure out exactly
what it is. If you need more information or details, I'll try and give
what I can get. :) Let me know what you think!
<pre>-- </pre>
Dave Reid
<a class="moz-txt-link-abbreviated" href="mailto:dave@davereid.net">dave@davereid.net</a>
</body>
</html>
_______________________________________________
jQuery mailing list
discuss@jquery.com
http://jquery.com/discuss/