I have a table. Each row is a link to some page(for example - google) which called by js "onClick window.open" method:

<tr  class='tr' onClick="win=window.open('');win.focus();" >

In the last column I have an anchor href link to other page (for example - jsfiddle):

<td class='td'><a href = "">JSFiddle</a></td>

If I click on anchor link it's opened, but also opened the first page called by onClick.

I've found a reverse issue:

How can I disable HREF if onclick is executed?

We can disable href by adding "return false" to onClick Event.

Is it possible to prevent onClick executing if anchor link was clicked?

Here is my demo: Fiddle

I have a table. Each row is a link to some page(for example - google.) which called by js "onClick window.open" method:

<tr  class='tr' onClick="win=window.open('http://google.');win.focus();" >

In the last column I have an anchor href link to other page (for example - jsfiddle):

<td class='td'><a href = "http://jsfiddle">JSFiddle</a></td>

If I click on anchor link it's opened, but also opened the first page called by onClick.

I've found a reverse issue:

How can I disable HREF if onclick is executed?

We can disable href by adding "return false" to onClick Event.

Is it possible to prevent onClick executing if anchor link was clicked?

Here is my demo: Fiddle

• javascript
• html
• hyperlink

3 Answers 3

I would remend you to change approach a little. Inline event handlers are never good idea. Consider this code.

HTML:

<table id="table">
    <tr data-url="http://google.">
        <td>Content</td>
        <td>Content</td>
        <td><a href="http://jsfiddle">JSFiddle</a></td>
    </tr>
    ...
</table>

JS:

var table = document.getElementById('table');

table.addEventListener('click', function(e) {

    var target = e.target;
    if (target.tagName == 'A') {
        return false;
    }

    if (target.tagName == 'TD') {
        var win = window.open(target.parentNode.getAttribute('data-url'));
        win.focus();
    }
}, false);

Demo: http://jsfiddle/CqRE9/

Yes it's possible!

$("tr").on("click", function(){ 
 $(this).attr("onClick", false); 
});

Demo: fiddle

This is an old question, but it showed up first in my search results and I suspect the suggested answer is a little more plicated than it needs to be. I found that if I add onclick="event.stopPropagation()" to my anchor, only the anchor is invoked, and the parent element's click handler is not. Works perfectly for my use case.