我正在使用这段代码:
$('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和当他们不再工作时，点击。
当前回答
将点击事件附加到表单包装器外的顶级元素，例如:
$('#header, #content, #footer').click(function(){
$('.form_wrapper').hide();
});
这也适用于触摸设备，只是要确保你的选择器列表中没有包含.form_wrapper的父类。
其他回答
这样不行吗?
$("body *").not(".form_wrapper").click(function() {
});
or
$("body *:not(.form_wrapper)").click(function() {
});
根据prc322的精彩答案构建。
function hideContainerOnMouseClickOut(selector, callback) {
var args = Array.prototype.slice.call(arguments); // Save/convert arguments to array since we won't be able to access these within .on()
$(document).on("mouseup.clickOFF touchend.clickOFF", function (e) {
var container = $(selector);
if (!container.is(e.target) // if the target of the click isn't the container...
&& container.has(e.target).length === 0) // ... nor a descendant of the container
{
container.hide();
$(document).off("mouseup.clickOFF touchend.clickOFF");
if (callback) callback.apply(this, args);
}
});
}
这增加了一些东西……
放置在带有“unlimited”参数的回调函数中 添加了对jquery的.off()的调用，与事件名称空间配对，以便在事件运行后将其从文档中解绑定。 包括触摸端移动功能
我希望这能帮助到一些人!
如果你点击.form_wrapper返回false:
$('body').click(function() {
$('.form_wrapper').click(function(){
return false
});
$('.form_wrapper').hide();
});
//$('.form_wrapper').click(function(event){
// event.stopPropagation();
//});
$('body').click(function(event) {
if (!$(event.target).is('p'))
{
$("#e2ma-menu").hide();
}
});
P是元素名。这里也可以传递id、类或元素名。
我觉得这样会容易得多。我是这样做的:
$(':not(.form_wrapper)').click(function() {
$('.form_wrapper').hide();
});
