How does google analytics track events when user navigates to other page inside one domain.

Question

In Google's documentation it is said that an event can be tracked in the following way:

<a onclick="_gaq.push(['_trackEvent', 'category', 'action', 'opt_label', opt_value]);">click me</a> 

or older version:

<a onclick="pageTracker._trackEvent('category', 'action', 'opt_label', opt_value);">click me</a>

I was looking with Firebug to the request that are made when a click on a link and I see there aborted request:

http://www.google-analytics.com/__utm.gif?utmwv=4.7.2&utmn=907737223&....

This happens because browser unload all javascript when user navigates to a new page. How in this case event tracking is performed?

Edit: Since one picture can be worth a thousand words...

When I click a link firebug shows me this sequence of requests (here are shown first four, after follows requests to fill page content)

Answer 1

The problem is that there isn't enough time for the script to finish running before the user is taken to the next page. What you can do is create a wrapper function for your GA code and in the onclick, call the wrapper function and after the GA code is triggered in your wrapper function, set a time out and update location.href with the link's url. Example:

<a href="somepage.html" onclick="wrapper_function(this,'category', 'action', 'opt_label', 'opt_value');return false;">click me</a>

<script type='text/javascript'>
function wrapper_function(that,category,action,opt_label,opt_value) {
  _gaq.push(['_trackEvent', category, action, opt_label, opt_value]);
  window.setTimeout("window.location.href='" + that.href + "'", 1000);
}
</script>

code will vary a bit based on your link but hopefully you get the idea - basically it waits a little bit before taking the user to the target url to give the script some time to execute.