当我单击页面上除一个 div ( ) 之外的任何位置时,如何触发功能id=menu_content
?
问问题
127675 次
6 回答
158
如果事件是由带有 id 的 div 生成的,click
您可以应用body
文档并取消click
处理,这会将事件绑定到单个元素并保存与每个元素的绑定,除了click
menu_content
click
menu_content
$('body').click(function(evt){
if(evt.target.id == "menu_content")
return;
//For descendants of menu_content being clicked, remove this check if you do not want to put constraint on descendants.
if($(evt.target).closest('#menu_content').length)
return;
//Do processing of click event here for every element except with id menu_content
});
于 2012-09-30T14:00:30.987 回答
50
请参阅jQuery 事件目标的文档。使用事件对象的 target 属性,您可以检测点击在#menu_content
元素内的位置,如果是,则提前终止点击处理程序。您将不得不使用.closest()
来处理点击源自#menu_content
.
$(document).click(function(e){
// Check if click was triggered on or within #menu_content
if( $(e.target).closest("#menu_content").length > 0 ) {
return false;
}
// Otherwise
// trigger your click function
});
于 2012-09-30T14:04:29.737 回答
46
试试这个
$('html').click(function() {
//your stuf
});
$('#menucontainer').click(function(event){
event.stopPropagation();
});
你也可以使用 外部事件
于 2012-09-30T14:00:12.330 回答
10
我知道这个问题已经回答了,而且所有的答案都很好。但我想为有类似(但不完全相同)问题的人在这个问题上加两分钱。
以更一般的方式,我们可以这样做:
$('body').click(function(evt){
if(!$(evt.target).is('#menu_content')) {
//event handling code
}
});
这样,我们不仅可以处理除具有 id 的元素menu_content
之外的任何事物触发的事件,还可以处理除我们可以使用 CSS 选择器选择的任何元素之外的任何事物触发的事件。
例如,在下面的代码片段中,我得到了由任何元素触发的事件,除了所有<li>
div 元素的后代元素 id myNavbar
。
$('body').click(function(evt){
if(!$(evt.target).is('div#myNavbar li')) {
//event handling code
}
});
于 2016-09-05T09:52:06.257 回答
7
这就是我所做的。想确保我可以点击我的日期选择器中的任何孩子而不关闭它。
$('html').click(function(e){
if (e.target.id == 'menu_content' || $(e.target).parents('#menu_content').length > 0) {
// clicked menu content or children
} else {
// didnt click menu content
}
});
我的实际代码:
$('html').click(function(e){
if (e.target.id != 'datepicker'
&& $(e.target).parents('#datepicker').length == 0
&& !$(e.target).hasClass('datepicker')
) {
$('#datepicker').remove();
}
});
于 2016-09-13T16:43:33.460 回答
1
你可以试试这个:
$(":not(#menu_content)").on("click", function(e) {
e.stopPropagation();
// Run your function when clicked anywhere except #menu_content
// Use with caution, 'cause it will prevent clicking on other elements
});
$("#menu_content").on("click", function(e) {
e.stopPropagation();
// Run when clicked on #menu_content
});
于 2021-06-11T17:30:33.423 回答