参见英文答案 >
jquery stop child triggering parent event8个
如果我有一个浮动消息框,我想知道是否在该框中单击段落文本也会在jQuery中注册点击它的父元素,或者如果我必须为子元素添加点击监听器.
如果我有一个浮动消息框,我想知道是否在该框中单击段落文本也会在jQuery中注册点击它的父元素,或者如果我必须为子元素添加点击监听器.
更新：这是基本布局：
<div id='msgBox'> <p>This is the <span>message</span></p> </div>
现在,如果我点击< p>中的文字或者在< span>点击$(‘#msgBox’)会触发吗？
更新2：我可以停止这种行为吗？
更新3：这是我要走的小提琴：http://jsfiddle.net/MZtbY/ – 现在有没有办法在达到一定水平后停止传播？所以点击< p>没关系,但点击< span>什么都不做？ – 有点像$(‘#msgBox：nth-child’).click(function(e){e.stopPropagation();});
解决方法
Here’s an example at jsFiddle
$('#msgBox').click(function(evt){
alert("click on msgBox: "+evt.target);
});
// stop bubbling for the span only.
$('#msgBox span').click(function(evt) {
evt.stopPropagation();
});
请注意,点击#msgBox< div> (这是jsFiddle中的红色框),或者段落文本的第一部分都将触发#msgBox上的事件处理程序;但点击< span>内的文字将不会.这是因为我们已经将一个处理程序直接应用于span,并在该事件上调用stopPropagation()以防止正常的冒泡操作.
更新：here’s an update to your fiddle显示相同的事情.
