点击外面时隐藏div

Question

我搜索和搜索不仅谷歌,但也在这里,仍然必须找到一个可行的解决方案.

我有一个默认隐藏的div,然后通过单击链接切换.当你点击div外面时我也希望它隐藏起来.很简单,我想,但我尝试过的任何东西都没用过.

这是jquery:

<script type="text/javascript">
    function toggleDiv(divID) {
    $("#"+divID).fadeToggle(200);
    }
</script>

以及切换它的链接:

<a onclick="toggleDiv('myDiv');">Link</a>

然后是div:

<div id="myDiv">
stuff
</div>

如果有人有任何建议,我会非常感激.

Answer 1

这应该是你的诀窍:

var openDiv;

function toggleDiv(divID) {
    $("#" + divID).fadeToggle(200, function() {
        openDiv = $(this).is(':visible') ? divID : null;
    });
}

$(document).click(function(e) {
    if (!$(e.target).closest('#'+openDiv).length) {
        toggleDiv(openDiv);
    }
});

示例→

编辑:现在适用于所有场景.