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
Share Improve this question edited May 23, 2017 at 12:29 CommunityBot 11 silver badge asked Feb 11, 2014 at 11:00 VladimirVladimir 4971 gold badge7 silver badges22 bronze badges3 Answers
Reset to default 2I 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.