It’s a good idea to prevent mixing your click/mouse handling. In the past when faced with the same problem, I’ve used one of two approaches (depending on my mood at the time):
Mouseup
Rather than use mousedown
, use jQuery’s mouseup
event. Mousedown
is typically stepped on by click
. By using mouseup
instead, you fire your event after the mouse is released (typically at the same time as click
or just after) and shouldn’t run in to the same problem.
Bind directly to click
This is the one I use the most often. Loop through the anchor tags on your page and change their event binding. You can set the click
event of each link to first fire your AJAX call and then (after completion) it will fire the original event.
For example:
jQuery(document).ready(function($) {
$('a').bind('click', function(e) {
// Do your AJAX stuff
return true;
});
});
Since you’re using jQuery, make sure you set async: false
when you use AJAX. This will force the browser to execute the request before moving on to loading the link.
If you’re using forms, you can easily unbind/rebind the submit
handler … unfortunately click
is a little less cooperative.