我有一个可点击的单元格,里面有一个链接,如下所示:
<html><body>
<table><tr><td onclick="alert('Cell click event fired.');">
Blah blah blah
<a href="#" onclick="alert('Link click event fired.'); return false;">Here</a>
</td></tr></table>
</body></html>
问题是当我点击链接时,两个onclick事件都会触发。我如何防止这种情况发生?
编辑:
如果有人能给予我一个如何做的例子,jQuery解决方案是可以接受的。
3条答案
按热度按时间dbf7pr2w1#
您需要停止事件的传播。
**EDIT:**既然您询问了jQuery,那么您可以删除内联的
onclick
属性,并按如下方式分配处理程序:注意,这将把click事件分配给 every
<td>
及其后代<a>
元素,您需要为更具体的解决方案提供更具体的标记。不要忘记在导入代码之前 * 导入jQuery库。
要以跨浏览器兼容的方式执行此操作,请执行以下操作:
示例:http://jsfiddle.net/7u9Jg/1/
x一个一个一个一个x一个一个二个x
xtfmy6hx2#
应设置“inner”元素,以便处理程序返回
false
:这将防止事件通过DOM的默认“冒泡”。(它还将防止
<a>
标记的默认行为,在本例中它什么也不是。)您也可以通过在处理程序中调用事件对象上的. preventDefault()方法来实现这一点,但您必须更改更多代码才能实现这一点,而且似乎不值得(在此)。
我经常这样做,看起来像:-)无论如何,返回
false
确实可以防止默认操作,但它不能取消冒泡。要做到这一点,处理程序可以调用.stopPropagation()(或在旧IE浏览器中设置事件对象上的“cancelBubble”标志,或类似的东西)。然而,要做到这一点,您必须以不同的方式注册您的事件处理程序(嗯,您可能没有 * 必须 *,但我不记得使用内联处理程序代码获得事件对象所必需的技巧。)我真的很讨厌通过插入框架来回答问题,但是事件处理(以及处理所有不同浏览器的变幻莫测)是我乐意委托给框架的事情之一;几乎你所选择的任何东西都会使事件处理更容易和更可靠。
qzwqbdag3#
这难道不是你想要的吗?通过在
<td>
中包含onclick事件,你就是在告诉浏览器去做这件事..你能把你需要的代码合并到你的<a>
onclick中吗?