calling functions in javascript

I must be missing something

[too much information]

I have a script that I use to track my AdSense performance, but now that I am adding affiliate marketing and other content ads I want to make it more generic so I can track all of it. Here's what I have so far:

(from the 'adsense tracking script' thread March'04)
<script language="javascript">
function hit(net) {
window.focus();
if (window.status) {
img = new Image();
img.src = 'includes/tracking.php?network=' + net;
};
};
</script>

now I am trying to call the function with an 'onclick' like this:

<div onclick="hit('affiliate')">...</div>

but my tracking script does not receive any data. So I must be doing something wrong, is it OK to put an 'onclick' in a <div> tag or should I use something else?

keep in mind that I have a few <div>'s that I want to track the clicks for, each (currently) has the onclick in it.

any ideas that could give me a clue?

[Bernard Marx]

Try a little investgation.

function hit(net) {
  window.focus(); /* don't think this is necessary */
  alert(1);
  if (window.status) { 
    alert(2);
    img = new Image(); 
    img.src = 'includes/tracking.php?network=' + net; 
  } 
}

If window.status is empty, then the statements in the 'if' block won't be executed.

[too much information]

I'm not sure if the window.focus(); is necessary either, but I'm trying to track clicks within the <div>'s that contain affiliate links and content ad blocks, so if the Status bar is empty it probably shouldn't count as a click on an ad.

So in testing what I have so far I am clicking on a link within the <div> and the status bar does contain the destination URL so everything should work.

Let me try it without the if statement and see what happens.

[Bernard Marx]

This may have something to do with bubbling, and the order of events.

A few months back someone else was asking about this. They had an example of this, and after some fiddling it worked - when the event handler was directly on the link element.

I was a little surprised that the browser continued making the request for the image even though it was changing page location immediately after having created the new Image object. However, according to the poster, the technique did work, and was creating a record in his server logs.

The problem here - I'm inclined to believe - is that the default action of the link being followed is occurring before the onclick event bubbles up to the containing div.

Using the 'event capture' phase would be better, and is relatively easy for browsers supporting the standards' event model. I'm not so sure about IE.

In the absence of better knowledge, I'd go for putting the onclick handler directly onto every relevant link. Of course, this will have to be done dynamically.

After load (or in a script block after the containing div)
- grab the collection of links
var theLinks = document.getElementById('_div_id_').getElementsByTagName('a')
- loop through, assigning the function to the onclick event
link.onclick = hit;

The link element will be available inside hit, as the keyword, 'this'.

[too much information]

that works great for affiliate links, but in AdSense, AdSonar and similar, there are no anchor tags, they are iframes and javascripts.

maybe if I create seperate functions for each content ad type, then capture the anchor tags as you described for the affiliate links.

(I think I'm going to learn alot about javascript in the next few days. ;o))

the default action of the link being followed is occurring before the onclick event bubbles up to the containing div

gread description by the way, I never thought of that.