我有一些名为 mydiv 的 div。我有一个附加的点击事件。在 div 里面我有一个链接。我希望在单击链接后不触发事件。喜欢
$(document).on('click', '#mydiv a', function(){
// How to disable parent's event here?
});
谢谢!
您遇到的问题是,绑定到的单击处理程序div
将首先触发,因为委托事件仅在事件传播到document
.
在您的#mydiv
点击处理程序中,在执行任何代码之前检查是否event.target === this
,这样,它只会在div
被点击时触发。
像这样的东西:
$('#mydiv').on('click', function(e) {
if (e.target === this) {
alert('div click fired!');
}
});
$(document).on('click', '#mydiv a', function(e) {
alert('anchor click fired!');
});
编辑如果您将事件处理程序附加到的唯一原因anchor
是为了防止触发点击处理程序,只需在执行任何其他操作之前div
检查目标是否不在anchor
点击处理程序中:div
$('#mydiv').on('click', function(e) {
if ($(e.target).is('a')) {
return;
}
alert('div click fired!');
});
这应该可以满足您的需求:
$(document).on('click', '#mydiv a', function(e){
// How to disable parent's event here?
e.stopPropagation();
});
试试这个,这样你就可以使用单个 JQuery
HTML
<div id="mydiv">
<span> Hello, How are you? </span>
<a id="alink" href="#"> Click ME </a>
</div>
查询
$(document).on('click', '#mydiv', function(event){
alert("You clicked on Div Span");
}).children().find("#alink").click(function(e) {
return false;
});