Question

如何防止点击按钮后调用window.location？

<tr onclick="window.location='www.google.com'">

    <td>Toggle Button</td>

    <td style="text-align:left;">

        <button class="btn btn-link text-info" data-toggle="collapse" data-target="#company@item.Id">
            Details
        </button>

        <div id="myitems5" class="collapse">
            items
            items
            items
        </div>

    </td>
</tr>

Answer 1

最小的变化方式是这样：

<tr onclick="if (!event.target.closest('button[data-toggle]')) { window.location = '//www.google.com'; }">

...这表示，如果事件在传递到button的途中通过具有data-toggle属性的tr传递，则您什么都不做，但是如果您做了做window.location（注意那里的字符串的修复）。

但是我不会那样做。我将使用适当的事件处理程序（可能是表的委托之一），然后在该事件处理程序中进行检查。

例如：

theTable.addEventListener(function(e) {
    var tr = e.target.closest("tr");
    if (tr && this.contains(tr)) {
        var btn = e.target.closest("button[data-toggle]");
        if (!btn || !tr.contains(btn)) {
            window.location = "//www.google.com";
        }
    }
});

在两种情况下，代码都使用Element#closest，您可能需要在过时的浏览器中进行填充。

如果用户单击该行的折叠按钮，如何禁用整个行的onclick？

1 个答案: