单击jQuery中的元素会导致气泡上升到正文。如果绑定(bind)到显示警报的正文的单击处理程序,则单击任何元素都会冒泡到正文并触发警报。我的问题是,是否有任何方法可以知道是由于直接单击到 body 而触发了 body 警报,还是由于气泡上升到 body 而触发了单击。
最佳答案
比较 event.target
和this
。 this
始终是绑定(bind)处理程序的事件; event.target
始终是事件起源的元素。
$(document.body).click(function(event) {
if (event.target == this) {
// event was triggered on the body
}
});
对于您知道在文档中唯一的元素(基本上只是
body
),您还可以检查nodeName
的this
:$(document.body).click(function(event) {
if (event.target.nodeName.toLowerCase() === 'body') {
// event was triggered on the body
}
});
您必须执行
toLowerCase()
,因为nodeName
的大小写在浏览器之间是不一致的。最后一个选择是,如果您的元素有一个ID,则将其与ID比较,因为它们也必须是唯一的:
$('#foo').click(function(event) {
if (event.target.id === 'foo') {
// event was triggered on #foo
}
});