我有一个表行,该行在表行内的任何位置都具有与鼠标单击关联的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的链接,那么我希望忽略该操作,然后单击该链接。
不幸的是,该行为是首先被观察到的,它恰好使链接文本的位置移动到足以使单击消失的程度。换句话说,在这种情况下,用户实际上无法单击链接并转到page2。
如何禁用鼠标单击链接的点击 Action ?
谢谢!
更新:根据答案,我最终在HTML的末尾包含了以下JavaScript,该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部分,因此我在此处添加了所需的内容。
感谢您的所有帮助和好的建议! :)
最佳答案
如果您使用的是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)