Combine two javascript onclick events

Question

I have an input button that calls a window.location.href event, and also want to add google analytics event tracking to the same button...

How would I combine these two events into one statement?

<input type="button" value="Learn More!"  onclick="window.location.href='site1'" />

and this event:

onclick="_gaq.push(['_trackPageview', '/externalsite/site1']);"

Answer 1

You could use jQuery.

But a quick fix is to just combine them:

<input type="button" value="Learn More!" onclick="_gaq.push(['_trackPageview', '/externalsite/site1']); window.location.href='site1'" />

Statements are separated with a semi-colon.

Answer 2

Concatenate both, and add them together:

<input type="button" value="Learn More!"
       onclick="_gaq.push(['_trackPageview', '/externalsite/site1']);
                window.location.href='site1';" />
<!-- Within HTML tags, newlines don't matter. For readability, I have split the 
      attributes over three lines-->

Note that the order matters . If you first use the window.location.href assignment, the second part can be ignored, because the page unloads.

Answer 3

<script>
function handleClick(){
  _gaq.push(['_trackPageview', '/externalsite/site1']);
  window.location.href='site1'
}
</script>
<input type="button" value="Learn More!"  onclick="handleClick()" />

Answer 4

<input type="button" value="Learn More!"  onclick="_gaq.push(['_trackPageview', '/externalsite/site1']); window.location.href='site1'" />

Answer 5

You should try moving your JavaScript off the element like so:

HTML

<input type="button" value="Learn More!" id="myBtn" />

JavaScript

(function(d, w) {
    var btn = d.getElementById('myBtn');
    btn.onclick = function() {
        _gaq.push(['_trackPageview', '/externalsite/site1']);
        w.location.href = 'site1';
    };
}(document, window));

It is always a better idea to use Unobtrusive JavaScript when you can. You can read more here:

• http://www.simonecarletti.com/blog/2010/06/unobtrusive-javascript-technique/

• http://en.wikipedia.org/wiki/Unobtrusive_JavaScript

Answer 6

You can combine statements with a semicolon:

<input type="button" value="Learn More!"  onclick="window.location.href='site1'" />

In your case, make sure to call the redirect as the last operation, it could be that execution is terminated when you are leaving the page.