用户在div外部点击时的JQuery事件？

Question

每当用户点击div外部以隐藏该div时,是否可以调用任何事件？

我试过使用$(document).click(),但是即使用户点击了应该显示div的链接,也会调用一个.因此,单击处理程序事件显示div,并立即$(document).click()隐藏它,这意味着div永远不会显示.

想法？

Answer 1

您可以尝试将onclick事件处理程序委托给body元素(或其他合适的父容器),并测试target元素是否为reveal链接:

$("body").click(function(e) {
    if(e.target.id == "idOfLinkToShowDiv") {
        $("#idOfTheDiv").show();
    } else {
        $("#idOfTheDiv").hide();
    }
});

以上内容可以缩短.toggle:

$("body").click(function(e) {
    $("#idOfTheDiv").toggle(e.target.id == "idOfLinkToShowDiv");
});

其他方式:

$("body").click(function() {
    $("#idOfTheDiv").hide();
});

$(".showLink").click(function(e) {
    e.stopPropagation();
    $("#idOfTheDiv").show();
});