'OnClick' interrupts my hyperlink

Question

I have an <a> tag that contains a span. The span has javascript attached to it that does something. As a result, when the span is clicked, the javascript runs, but the <a href> is ignored and it doesn't navigate to it.

Is there a way to make it continue to navigate as normal?

<a href='http://www.google.com'&gt;&lt;span&gt;some text</span></a>

the click event is actually registered some other way than onclick, my question title is a bit misleading.

Hovering over the link puts the URL into the status bar as you'd expect, just clicking it does nothing.

The javascript is simple return true; at the moment while I try to figure it out.

I suspect as the javascript is in the span and not the a that it gets confused about how to propogate back up to the href once the javascript is done.

I'm afraid I don't know how it's bound, because it's some bizarre third party component.

Answer 1

Your javascript is probably returning a value that is non-true (a value that evaluates to boolean false). The simple solution is to add a return true statement to the end of the function/code that runs when the link is clicked.

Answer 2

If you're using jQuery, make sure you don't return false in your event handler. That will override the defaults.

If not: you may need to explicitly code what you want your link to do after your JS:

<a href="www.example.com" onclick="javascript:someFunction(); window.location = \"www.example.com\"">click here</a>

This will execute a function, then redirect the window to the proper location.

Answer 3

I suspect as the javascript is in the span and not the a that it gets confused about how to propogate back up to the href once the javascript is done.

Yes. If your onClick handler is on the span, the browser can't read the hyperlink's href attribute. If the link has an id, you can do :

function onclick()
{
    //Do your things...

    var link = document.getElementbyId('your_link_id').href;
    window.location.href = link;
    return true;
}