Question

我有一个表行，在表格行的任何位置都有鼠标点击附加的Javascript操作：

<tr onmousedown="someAction(this)">
    <td>cell 1</td>
    <td>cell 2</td>
    <td><a href="page2.html">cell 3</a></td>
</tr>

如果用户点击该行中的任何位置，我希望遵循Javascript操作someAction（this）。但是，如果用户点击指向page2的链接，那么我希望忽略该操作并遵循链接。

不幸的是，首先会观察到该动作，这恰好会使链接文本的位置移动到足以使点击被删除。换句话说，在这种情况下，用户实际上无法单击链接并转到第2页。

如何禁用链接点击的mousedown操作？

谢谢！

更新：根据答案，我最终在HTML的末尾包含了以下JavaScript，它按照建议注册了一个停止传播的事件处理程序，如下所示：

...
<script type="text/javascript" language="javascript">
//<![CDATA[
function stopEvent(ev) {
    ev.stopPropagation();
}
var links = document.getElementsByTagName('a');
for (var i = 0; i < links.length; i++) {
    links[i].addEventListener("onmousedown", stopEvent, false);
}
//]]>
</html>

这可以很容易地包含在文档的onload事件中，但由于其他原因已经需要CDATA部分，所以我在这里添加了我需要的内容。

感谢所有帮助和好建议！：）

Answer 1

如果您使用的是jQuery，那就简单了（假设您为tr元素设置了id ='row'，为元素设置了id ='link'）：

$('#row').click(someaction);
$('#link').click(function(event){event.stopPropagation()});

您可以查看此示例：http://jsfiddle.net/VDQMm/

没有jQuery，它几乎是一样的，但你必须先获取每个元素的句柄，然后使用addEventListener方法附加一个事件监听器（使行处理程序使用冒泡而不是通过将最后一个参数设置为false来捕获），然后是同样的旧event.stopPropagation（）。

就像这样（http://jsfiddle.net/VDQMm/2）：

var row = document.getElementById('row');
var link = document.getElementById('link');
row.addEventListener('click',alert('clicked row!'),false)
link.addEventListener('click',function(event){event.stopPropagation()},false)

Answer 2

将event.stopPropagation()添加到链接的mousedown事件中。这将阻止事件冒泡到tr。

Here is an example

如何忽略第一个事件并跳到第二个？

2 个答案: