我正在使用这段代码:
$('body').click(function() {
$('.form_wrapper').hide();
});
$('.form_wrapper').click(function(event){
event.stopPropagation();
});
这个HTML:
<div class="form_wrapper">
<a class="agree" href="javascript:;">I Agree</a>
<a class="disagree" href="javascript:;">Disagree</a>
</div>
问题是，我有链接在div和当他们不再工作时，点击。
当前回答
如果你在ios系统上有问题，鼠标up在苹果设备上无法工作。
在jquery mousedown /mouseup工作的ipad?
我用这个:
$(document).bind('touchend', function(e) {
var container = $("YOURCONTAINER");
if (container.has(e.target).length === 0)
{
container.hide();
}
});
其他回答
更新解决方案为:
使用mouseenter和mouseleave代替 的悬停使用活动事件绑定
var mouseOverActiveElement = false;
$('.active').live('mouseenter', function(){
mouseOverActiveElement = true;
}).live('mouseleave', function(){
mouseOverActiveElement = false;
});
$("html").click(function(){
if (!mouseOverActiveElement) {
console.log('clicked outside active element');
}
});
这段代码检测页面上的任何单击事件，然后当且仅当所单击的元素既不是#CONTAINER元素也不是它的后代元素时，隐藏#CONTAINER元素。
$(document).on('click', function (e) {
if ($(e.target).closest("#CONTAINER").length === 0) {
$("#CONTAINER").hide();
}
});
现场演示与ESC功能
适用于桌面和移动设备
var notH = 1,
$pop = $('.form_wrapper').hover(function(){ notH^=1; });
$(document).on('mousedown keydown', function( e ){
if(notH||e.which==27) $pop.hide();
});
如果在某些情况下，你需要确保你的元素在点击文档时是可见的:If ($pop.is(':visible') && (notH||e.which==27)) $pop.hide();
var exclude_div = $("#ExcludedDiv");; 美元(文档).click(函数(e) { 如果(! exclude_div。Is (e.target)) //如果目标div不是一个你想排除然后添加类隐藏 $ (" .myDiv1 ") .addClass(“隐藏”); })；
小提琴
为我工作在所有设备上(2023);)
<section class="form-wrapper">
<div class="popup-container">
Popup Me
</div>
</section>
$('.form-wrapper').on('click', function(e) {
var pop_container = $(".popup-container");
// if the target of the click isn't the pop_container nor a descendant of the pop_container
if (!pop_container.is(e.target) && pop_container.has(e.target).length === 0) {
//you action here
pop_container.hide();
}
});
