Как в javascript “закрывать” div при клике вне этого дива?

При клике по некоторому элементу управления на экране появляется div c текстом подсказок. У дива есть кнопка «закрыть». Но хочется, чтобы он закрывался не только по клику на кнопку, но и вне области этого div’a.
Вот нашёл хороший ответ:
$(".button").click(function() {
$('.toggled_block').toggle();
});
$(document).on('click', function(e) {
if (!$(e.target).closest(".parent_block").length) {
$('.toggled_block').hide();
}
e.stopPropagation();
});

.parent_block {
width: 200px;
height: 100px;
}
.button {
width: 200px;
height: 50px;
background: #00BB65;
border-radius: 5px;
overflow: hidden;
}
.toggled_block {
width: 200px;
height: 50px;
background: #fff;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #ccc;
display: none;
}


Share this post:

Recent Posts

Leave a Comment