Скрыть элемент при клике за его пределами Jquery

Реклама

Как же cкрыть элемент при клике за его пределами Jquery?

Благодаря этого способа можно использовать для создании прототипа потери фокуса к блочным элементам на вашей веб-странице (прототип события blur который по сущности своей не распространяется на все блочные элементы в определенных видах браузеров). Рассмотрим такой пример, что у нас на странице имеется элемент с class = white, обратной формой для пользователя.




И данный элемент должен пропасть, если пользователь кликнет мышью по любому месту в черном блоке страницы, за исключением самого данного элемента с классом white. Данную задачу можно решить обработкой клика мыши на элементе black. А в самом обработчике, нужно будет проверить, не является ли источником события наш элемент с class = white или не является одним из его потомков:


$(function(){
  $(".black").click(function(event) {
    if ($(event.target).closest(".white").length) return;
    $(".black").css("display","none");
    event.stopPropagation();
  });
});

Продемонстрируем данный пример на рабочем примере: