0

Есть поп-ап форма, нужно ее закрывать если клик за ее пределами и закрывать-открывать если клик по кнопке которая ее вызывает. Собственно код написал. Но не могу понять как совместить в селекторе $(document) и $(".region-item"). Или может у кого есть сниппет получше?

$(document).click(function (event) {
        if($(event.target).has(".all-regions").length == 1) {
            $(".all-regions").toggle(0).find(".search-region_row").focus();
        }
    });

    $(".region_item").click(function(event) {
        $(".all-regions").toggle(0).find(".search-region_row").focus();
    });

1 ответ 1

0

Ну считай, что они соединены по дефолту, все элементы DOM располагаются в document тем, или иным образом.

Небольшой сниппет, с доработанным ответом с engSO:

$(window).click(function() {
  $('#menucontainer').hide();//Обрабатываем клик ВНЕ меню
});
$(document).on('click','.someControl', function(event){
  $('#menucontainer').show();//Обрабатываем клик на элементы управления, вызывающие меню
  event.stopPropagation();//Убираем дальнейшее дефолтное поведение
})

$('#menucontainer').click(function(event) {
  event.stopPropagation();//обрабатываем клик внутри меню
});
.wrapper{
  height: 100%;
  width: 100%;
}
#menucontainer{
  background: whitesmoke;
  position: fixed;
  top: calc(50% - 80px);
  left:calc(50% - 100px);
  display: flex;
  flex-direction: column;
  padding: 40px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='button' value='ShowDialog' class='someControl'/>
<div class='wrapper'>
  <div id='menucontainer'>
    <input type='text' value='SomeTextHere' />
    <input type='button' value='Close' onclick='$(this).parent().hide()'/>
  </div>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.