我正在使用这段代码:
$('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和当他们不再工作时，点击。
当前回答
这么多答案我都用不上。相反，我采取了公认的答案(工作得很好)，并缩短为以下(使用后代选择器):
$(document).mouseup(function(e)
{
if (!$(e.target).is("#targetSelector,#targetSelector *")) {
$('#targetSelector').hide();
}
});
因为它只以用户交互的速度运行，没有给变量赋值
其他回答
我是这样做的:
var close = true;
$(function () {
$('body').click (function(){
if(close){
div.hide();
}
close = true;
})
alleswasdenlayeronclicknichtschliessensoll.click( function () {
close = false;
});
});
var exclude_div = $("#ExcludedDiv");; 美元(文档).click(函数(e) { 如果(! exclude_div。Is (e.target)) //如果目标div不是一个你想排除然后添加类隐藏 $ (" .myDiv1 ") .addClass(“隐藏”); })；
小提琴
如果你在ios系统上有问题，鼠标up在苹果设备上无法工作。
在jquery mousedown /mouseup工作的ipad?
我用这个:
$(document).bind('touchend', function(e) {
var container = $("YOURCONTAINER");
if (container.has(e.target).length === 0)
{
container.hide();
}
});
您可以将tabindex设置为父元素<div>，而不是监听DOM上的每一次单击以隐藏一个特定的元素，并监听focusout事件。
设置tabindex将确保在<div>上触发模糊事件(通常不会)。
所以你的HTML看起来是这样的:
<div class="form_wrapper" tabindex="0">
<a class="agree" href="javascript:;">I Agree</a>
<a class="disagree" href="javascript:;">Disagree</a>
</div>
你的JS:
$('.form_wrapper').on('focusout', function(event){
$('.form_wrapper').hide();
});
你最好这样写:
var mouse_is_inside = false;
$(document).ready(function()
{
$('.form_content').hover(function(){
mouse_is_inside=true;
}, function(){
mouse_is_inside=false;
});
$("body").mouseup(function(){
if(! mouse_is_inside) $('.form_wrapper').hide();
});
});
