javascript - 如果执行了 anchor href 链接，则禁用 onClick 事件

Question

我有一张 table 。每行都是一个指向某个页面(例如 - google.com)的链接，该页面由 js“onClick window.open”方法调用:

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

在最后一列中，我有一个指向其他页面的anchor href 链接(例如 - jsfiddle):

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

如果我单击 anchor 链接，它会打开，但也会打开由 onClick 调用的第一个页面。

我发现了一个反向问题:

How can I disable HREF if onclick is executed?

我们可以通过在 onClick 事件中添加“return false”来禁用 href。

是否可以在单击 anchor 链接时阻止 onClick 执行？

这是我的演示: Fiddle

Answer 1

我建议您稍微改变一下方法。内联事件处理程序从来都不是好主意。考虑这段代码。

HTML:

<table id="table">
    <tr data-url="http://google.com">
        <td>Content</td>
        <td>Content</td>
        <td><a href="http://jsfiddle.net">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);

演示:http://jsfiddle.net/CqRE9/