javascript - 显示div，然后在外部单击时隐藏

我有以下代码：

$(function() {
$('#toggle4').click(function() {
    $('.toggle4').slideToggle('fast');
    return false;
});
});

效果很好，并显示了'.toggle4'div，但是当我单击它的外面/远离它时，我想再次将其隐藏。

所以我添加了这个：

$(document).click(function() {
        $(".toggle4").hide();
});

可以，但是即使我在“ .toggle4” div（这是搜索表单的输入框）内单击时，它也会隐藏div。

有任何想法吗？谢谢。

最佳答案

这是因为当您在.toggle4中单击时，单击事件使DOM冒泡并触发绑定到文档的事件。您应该可以通过以下方式解决此问题：

$('.toggle4').click(function(e){
    e.stopPropagation()
})

关于javascript - 显示div，然后在外部单击时隐藏，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/40852765/