Question

This is a nasty one.

I have an external link.

<a href="http://www.example.com" target="_blank">

now I want to track a Google AdWords conversion every time that link gets clicked.

To do that, I add a click event that loads a Google image. The image counts the conversion. To make absolutely sure the image gets loaded before the user leaves, I use the image’s load event to proceed to the original link’s target.

$("#linkname").click(function() {

 var element = document.createElement("img");
 element.onload = function() { ..... };
 element.setAttribute("src", "http://www.googleadservices.com/....");
 document.body.appendChild(element); 

 });

This will work fine using location.href. However, it won’t work for target="blank" links.
I’m baffled as to what to put into the onload function in order to open a new window.

• I can’t use window.open because it will be caught by pop-up blockers (Because it’s located in the image’s onload event, it looks like a purely programmatical call that has nothing to do with the link being clicked.) Also, calling window.open without any options does not give me any controls in Google Chrome.

• I can’t make the click event continue its normal course because I have to wait until the image is loaded, which is an asynchronous operation!

What I would need, essentially, is a way to open a target="_blank" link programmatically, something that may not be possible because it could be circumvented by pop-up-blocker-breakers.

Alternatively, I would need a way to reliably count hits while letting the link’s original click event continue as it’s supposed to.

Does anybody have an idea what to do?

Answer 1

Since the link opens in new window, you don’t really have to wait for the image to load. Let the image load in the current window (as is being done) and let the user see the new window as normal. It would be very unlikely that the user can close the window before the image is loaded, thus the count would not be disturbed.