我正在使用这段代码:
$('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和当他们不再工作时，点击。
当前回答
如果你点击.form_wrapper返回false:
$('body').click(function() {
$('.form_wrapper').click(function(){
return false
});
$('.form_wrapper').hide();
});
//$('.form_wrapper').click(function(event){
// event.stopPropagation();
//});
其他回答
我是这样做的:
var close = true;
$(function () {
$('body').click (function(){
if(close){
div.hide();
}
close = true;
})
alleswasdenlayeronclicknichtschliessensoll.click( function () {
close = false;
});
});
在弹出窗口中使用接受的答案时，可能会遇到一些问题。在某些情况下，点击一个随机位置可能会导致不必要的操作，即错误地单击一个按钮可能会将您带到一个新页面。
我不确定这是否是最有效的解决方案，但为了防止这种情况，我建议使用屏幕掩码。确保屏幕掩码位于<body>标签的正下方，这样它就可以覆盖所有的屏幕宽度:100%;高度:100%。还要注意，它的z-index: 99高于所有元素。如果你想让另一个项目或div在屏幕掩码激活时可点击，只需为该项目或div分配更高的z-index。
屏幕掩码最初是不显示的(display:none)，当单击(onclick="hidemenu()")时，它调用一个hide函数。
<body>
<div class="screenmask" onclick="hidemenu()" style="position:fixed; width: 100%; height: 100%; top: 0px; right: 0px; display: none; z-index: 99;"></div>
处理“同一页面上多个不同弹出菜单”的javascript函数可能如下所示:
<script>
// an element with onclick="showmenu('id_here')" pops a menu in the screen
function showmenu(id) {
var popmenu = document.getElementById(id); // assume popmenu is of class .cardmenu
$('.cardmenu').hide(); // clear the screen from other popmenus first
$(popmenu).show(); // pop the desired specific menu
$('.screenmask').show(); // activate screenmask
}
function hidemenu() { // called when clicked on the screenmask
$('.cardmenu').hide(); // clear the screen from all the popmenus
$('.screenmask').hide(); // deactivate screenmask
}
</script>
我觉得这样会容易得多。我是这样做的:
$(':not(.form_wrapper)').click(function() {
$('.form_wrapper').hide();
});
将点击事件附加到表单包装器外的顶级元素，例如:
$('#header, #content, #footer').click(function(){
$('.form_wrapper').hide();
});
这也适用于触摸设备，只是要确保你的选择器列表中没有包含.form_wrapper的父类。
根据文档，.blur()不仅仅适用于<input>标记。例如:
$('.form_wrapper').blur(function(){
$(this).hide();
});
