Identifying the anchor tag when href is called

Question

Hi, How can you identify in a function whether it has been invoked by an anchor tag href?

event is null in this case. So event.target and event.srcElement won't work.

Code

HTML

<a href="SomeFunction();">Href works here</a>

JavaScript

   function SomeFunction ()
   {
      // I need to get the anchor element that invoked this function
   }

Answer 1

What about

<a href="SomeFunction(this);">Href works here</a>

function SomeFunction(context) {

    var callingElement = context;

}

Answer 2

As far as I know there are only two ways to accomplish this using standard Javascript. The first way has already been outlined -- pass the node as a parameter to the function. The other way would be to handle the onclick event of the anchor. This is very similar to the previous approach in that is requires that you modify the markup to pass a parameter to a function. To do this you'll need to change the markup to the following:

<a href="#" onclick="SomeFunction(event)">Href works here</a>

function SomeFunction(event) {
    var node = event.srcElement;
}

The above code would pass the event object along to the function which would give you all sorts of interesting information about the event.

If you're unable to change the markup that is sent to the browser, you might want to consider using something like JQuery or another AJAX library to search for and modify the event handlers of the nodes at runtime. Modifying the markup before it gets to the browser is obviously preferred, but sometimes you don't have a choice.

Lastly, if you cannot change the markup and don't want to modify the DOM at runtime, you can always see what Javascript engine specific features are available. For example, you might be able to make use of arguments.caller in those engines that support it. I'm not saying that it will work, but you might want to see what's available.

Answer 3

Following what @alex suggested, can you add a script to run in the page load to change the hrefs to be what you want (adding the 'this' reference)?

Take the following script for example, this will change the href value for anchor tags with id set to SomeID or class set to SomeClass:

function changeLinks() {
    var all_links = document.getElementsByTagName("a");
    for (var i=0; i<all_links.length; i++){
     if (all_links[i].id == 'SomeID' || all_links[i].className == 'SomeClass') {
      all_links[i].href = 'SomeFunction(this);';
     }
    }
}

Hope this helps...

Edit: Following your comment, you can try this:

var clickedAnchor = null;

function setClickedAnchor(obj) {
    clickedAnchor = obj;
}
function changeLinks() {
    var all_links = document.getElementsByTagName("a");
    for (var i=0; i<all_links.length; i++){
     if (all_links[i].id == 'SomeID' || all_links[i].className == 'SomeClass') {
      all_links[i].href = 'setClickedAnchor(this);' + all_links[i].href;
     }
    }
}