Animations not working when triggered from A HREF click in jQuery!

Question

I have noticed a strange thing happening in jQuery and wonder if anyone knows why?

Upon clicking the following anchor tag

<A ID="catchme" HREF="#">Add Row</A>;,

my jQuery script will catch the click and display a hidden table row. The problem is the considerable lag to the redraw operation. Additionally, none of the animations will work on the element being displayed.

However, when I use a <DIV> or <SPAN> to catch the clicks (i.e. styled as a fake text link), the animations work a treat!!

I was also using e.preventDefault() on the HREF to stop it from following the HREF's link. Removing e.preventDefault() did not fix the problem.

This issue occurred on IE7 and FF3.5 using jQuery 1.3.2.

Does anyone know how to fix this issue from anchor tag clicks??

Answer 1

When writing the event handler, are you passing it the parameter of e? Example:

$('a').click(function(e){
     e.preventDefault();
});

Without passing the parameter e, the preventDefault() call is worthless.

Answer 2

After much debugging, this turned out to be an undisplayed JavaScript deep in my own script stack. What may be of interest is that FireBug was deep sixing (ie. hiding) the error, However the Firefox Javascript console did in fact report the error!

Relying on Firebug as a single source of truth was my mistake ... lesson learned.

Thanks for those who tried to answer this one despite an insufficient description.