0

由于某些非常奇怪的原因，trwindow.location.href战胜了 td。如果我用警报替换它们，它们会以正确的顺序显示：td然后tr（，当点击右侧时td。）

<tr onclick="window.location.href='order?order=3'">
    <td>3</td>
    <td onclick="window.location.href='user?user=Bobo'">Eisenreichová Eva</td>
    <td>08. 05. 2013</td>
    <td>Převodem</td>
    <td>Nezaplaceno</td>
    <td>Přijato</td>
    <td>0</td>
    <td></td>
</tr>
4

4 回答 4

6

您需要防止click事件冒泡到<tr>. 用这个：

onclick="changeLocation(event, 'user?user=Bobo', true);"

（您也可以为活动做同样的<tr>事情）

并声明函数：

function changeLocation(e, newURL, noBubble) {
    if (noBubble) {
        e.stopPropagation();
    }
    console.log("Would be navigating to: " + newURL);
    //window.location.href = newURL;
}

（在您的真实代码中，您显然会删除该console.log行并取消注释更改 URL 的真实部分）

演示：http: //jsfiddle.net/yjjVy/

这允许它，因此如果您单击该特定<td>的，它将“获胜”。如果您单击其中<tr>的任何其他位置，它将“获胜”（因为没有其他事件与之冲突）。

于 2013-05-10T14:08:47.997 回答
2

td onclick 首先被触发，但 tr onclick 会覆盖 window.location.href

移动到另一个页面不会阻止调用其他 javascript。

window.location.href='http://www.google.com';
window.location.href='http://www.bing.com';

http://jsfiddle.net/vH758/

于 2013-05-10T14:12:29.227 回答
1

问题是点击会在 dom 树上冒泡。因此，td第一次调用 的 onclick，然后单击事件传播到tr并且该事件也被执行。

要停止传播，请使用：

<td onclick="window.location.href='user?user=Bobo'; event.stopPropagation();">

后台发生了什么：

文件结构：

  • 文档
    • 祖父母
      • 父母
        • 元素
      • 父母2
    • ...

事件：用户点击元素

结果：

  1. 元素的所有点击监听器都被执行 *
  2. 事件开始冒泡
  3. 父级的所有点击监听器都被执行 *
  4. 祖父母的所有点击监听器都被执行 *
  5. 文档的所有点击监听器都被执行 *

*侦听器获取事件对象，并有可能通过调用取消冒泡：

  • event.stopPropagation()：不让事件传播给父母，但在当前级别执行所有侦听器。
  • event.stopImmediatePropagation()：不让事件传播给父母，也不会在同一级别上调用其他侦听器

每一层你都可以检查点击事件对象的信息：

  • 当前正在处理的事件event.currentTarget
  • 最初被点击的元素event.target

希望有帮助

于 2013-05-10T14:08:58.887 回答
0

那是因为 Javascript 会读取给位置对象的最后一个 href 属性。这是必要的，首先它执行 td onclick，然后是 tr 。由于页面尚未加载，它指向您设置的最后一个 href 属性。

于 2013-05-10T14:09:57.530 回答