Adding code to onclick event

[metaforgebrandon]

I was wondering how I could add onclick event code to all outbound a tags. I understand I can get all a tags by tag name and do an a.onclick=function(){//code here} kind of thing.

My question is, if I do that will it add code to an already existing onclick event if one exists or will it over write it? I need it to add it.

This isn't as relevant on anchor tags as it is on form onsubmit events. I also need some code to add commands to onsubmit events for all forms pointing to an outside domain.

Thanks,
Brandon

[daveVk]

To avoid disturbing existing event handing, use event listeners, the following take care of browser differences

function addHandler( iEl, evtS, iHandler ) {
if ( iEl.addEventListener ) { iEl.addEventListener( evtS, iHandler, false); }
else if ( iEl.attachEvent ) { iEl.attachEvent('on' + evtS, iHandler ); }
}

[metaforgebrandon]

Can I add the event listener only to forms with outbound actions, and is there a way to make sure that my event launches first?

[metaforgebrandon]

I figured out the add my event first part. I still don't know how to get only outbound forms.

The add event first part goes as follows.

<script type="text/javascript">
if(window.addEventListener){ // Standard
var temp = document.getElementById("testLink").onclick;
document.getElementById("testLink").onclick = "";
if( temp != 'undefined' ){
document.getElementById("testLink").addEventListener('click', function(){
alert('test2');
}, false);
document.getElementById("testLink").addEventListener('click', temp, false);
}
}
else if(window.attachEvent) { // IE
var temp = document.getElementById("testLink").onclick;
document.getElementById("testLink").onclick = "";
if( temp != 'undefined' ){
// IE does this in reverse order for some reason
document.getElementById("testLink").attachEvent('onclick', temp, false);
document.getElementById("testLink").attachEvent('onclick', function(){
alert('test2');
}, false);
}
}
</script>

[daveVk]

only to forms with outbound actions

Define what you mean by this, and answer may be apparent ?

All link elements within certain forms ?

[metaforgebrandon]

I mean actions that are going to another hostname. With links you can check

if (href.hostname != location.host)

I'm just not sure how to do the equivalent with form actions.

[daveVk]

if (href.hostname != location.host)

href is a string ? so can't see that href.hostname will work.

The url syntax from .href on link elements and .action on form elements is the same, so same test should be Ok.

You need to consider that url may not contain the hostname ( relative urls ), maybe look for text other than location.host between \\ and \

[metaforgebrandon]

Sorry, by href I meant anchor tag. I'm getting a.hostname and comparing it to location.host. That actually works just fine for relative urls. I need to get form.hostname. But I'm not sure how to do that.

[daveVk]

Did not realize you could get hostname from anchor element

try

var aEl = document.createElement("a");
aEl.href = formEl.action;
if ( aEl.hostname === location.hostname ) { ... };

[metaforgebrandon]

Very Good Sir! That works perfectly. Thanks a lot.