If it won't be simple, it simply won't be. [Hire me, source code] by Miki Tebeka, CEO, 353Solutions

Tuesday, April 15, 2008

Registering URL clicks

Some sites (such as Google), gives you a "trampoline" URL so they can register what you have clicked on. I find it highly annoying since you can't tell where you are going just by hovering above the URL and you can't "copy link location" to a document.

The problem is that these people are just lazy:
<html>
   <body>
       <a href="http://pythonwise.blogspot.com"
           onclick="jump(this, 1);">Pythonwise</a> knows.
   </body>
   <script src="jquery.js"></script>
   <script>
       function jump(url, value)
       {
           $.post("jump.cgi", {
               url: url,
               value: value
           });

           return true;
       }
   </script>
</html>

Notes:
  • Using jQuery
  • "value" can be anything you want to identify this specific click. I'd use a UUID and some table for registering who is the user, what is the url, the time ...

7 comments:

Dotan Dimet said...

If you're using jQuery, why set onClick in HTML?

Instead, you could just do

document.ready(
function() {
$('a').each(function() {
url = $(this).attr('href');
$(this).click(
function() {
$.post('jump.cgi',
{ 'url': url,
'value': x } );
} );
} );
} );

Miki said...

I agree, however my personal incline is to do as little as possible on the client side.

Also, your approach takes *all* links, while the common case will be just to take some of them.

Cool hack though ...

John said...

Of course the problem with either of these approaches is that if the user has javascript disabled, then everything still works fine for the user but the site loses the tracking they need/want. You could just as easily reverse the logic though and have the actual link href point at the jump counter and use javascript to show the jump target onmouseover of the link.

Miki said...

You are right, however I prefer that the user will "win" and the site will "loose" and not the other way.

If the user disables JS, then the onmouseover will not work.

Anonymous said...

Finally!

A post I can understand.

Happy passover,
the guy with the Coke.

Dotan Dimet said...

Miki - yes, my example attaches click events to every link (actually to every anchor tag, which might be worse), but if you only want that behavior on some links, just use a more specific selector - change $('a') with $('a.outgoing') to only track clicks on links with the class="outgoing" attribute, or $('#blogroll a') to only track clicks on links in an element with the id "blogroll". Or use one of the more trickier CSS3 selectors that jQuery supports to apply the behavior only to link elements with an href attribute containing (or not containing specific text.

Anonymous said...
This comment has been removed by a blog administrator.

Blog Archive