Detect external link Click?

Question

How can i detect external link click?

I have a simple question, which may or may not have an simple answer. I need to detect if some of my page's user's have clicked an external link, an ad for example.

My first tought was that i would place an random number of transparent div's over a specific link so an user should click on it until he'll get redirected to a new page but that would be inconvievnant for users and would still be exploitable.

I hope that you guys can help me out and i'll do my best to help you out one day.

Sorry for my english as my native language isn't english.

First question: by "external" you mean link inside iframe? Second question: you want to detect it and then what? — Shadow The GPT Wizard, Jan 18 '11 at 12:14

score 6 · Accepted Answer · answered Jan 18 '11 at 12:25

6

with jquery, select all external links and an handler for click event:

// Creating custom :external selector
$.expr[':'].external = function(obj){
    return !obj.href.match(/^mailto\:/)
            && (obj.hostname != location.hostname);
};

// Manage clicks on external links
$('a:external').click(function() {
    // do your stuff here, ie send the link href to some server-side script
    $.ajax({ type: "POST", url: "some.php", data: "href="+$(this).attr("href") });
});

answered Jan 18 '11 at 12:25

guido

18,864
6
70
95

Thanks that was useful! I also had to check (href === "") in order to exclude those anchors without href. – tehsis Apr 09 '12 at 17:52
For Google Analytics it should be like this: ```var trackOutboundLink = function(url) { ga('send', 'event', 'outbound', 'click', url, { 'transport': 'beacon', 'hitCallback': function(){document.location = url;} }); } jQuery(document).ready(function($) { $.expr[':'].external = function(obj){ return !obj.href.match(/^mailto\:/) && (obj.hostname != location.hostname); }; $('a:external').click(function() { trackOutboundLink($(this).attr("href")); }); });``` – Cassiano Oct 04 '16 at 12:50

score 1 · Answer 2 · answered Mar 13 '17 at 08:14

You can track outbound clicks that do not belong to the current site by doing the following:

jQuery(document).ready(function($) {
    $('body').on('click', 'a[href^="http"]:not([href*="//' + location.host + '"])', function(){
        if (typeof(_gaq) !== 'undefined') {
            _gaq.push(['_trackEvent', 'outbound', 'click', this.href.match(/\/\/([^\/]+)/)[1]]);
            _gaq.push(['t2._trackEvent', 'outbound', 'click', this.href.match(/\/\/([^\/]+)/)[1]]);
        }
    });
});

Obviously you can strip out the Google Analytics gaq stuff if you don't need it.

score 1 · Answer 3 · edited May 23 '17 at 11:46

1

Hey, you really need to use google analytics. Incase you do not want to do that, check this out. Logging hyperlink clicks on my website

edited May 23 '17 at 11:46

Community

1
1

answered Jan 18 '11 at 12:14

Neeraj

8,408
8
41
69

http://www.google.com/analytics/ this is pretty neat tool for logging link clicks as well as some other stuff.And all you would really need to do is simply add a few lines of code at the end of each html page on the website. – Neeraj Jan 18 '11 at 12:15

The Coding Monk · Answer 4 · 2011-01-18T12:31:09.083

If you can add an extra class to the links you could do something like that:

<a href="http://www.externalsite.com/" class="external">AD</a>

i.e. add an "external" class to every link, and then use jquery like this:

$('.external').click(function(event) {
    // do something before the user gets redirected
});

You could also use event.preventDefault() to prevent the default action (i.e. redirecting the user) and then do something else.

EDIT If you can't add class="external" directly into the markup, you could add it dinamycally using jQuery using some code like:

$('a').each(function() {
    if($(this).attr('href') is an external link) {
        $(this).addClass('external');
    }
});

I've not tested this second snippet but it should work.

Detect external link Click?

4 Answers4