jQuery - Закрыть диалоговое окно при нажатии на него

Question

Каждый раз, когда пользователь нажимает ссылку «Зарегистрироваться» или «Войти», появляется всплывающее окно. Но пользователь должен снова щелкнуть ссылку «Вход» или зарегистрироваться, если он хочет закрыть всплывающее окно. Можно ли закрыть всплывающее окно, если щелчок сделан в другом месте на веб-странице?

Это код выпадающее меню на веб-странице:

<!---dropdown---> 
<script type="text/javascript"> 
    //<![CDATA[ 
    function showlogin(){ 
     $("#loginbox").animate({"height": "toggle"}, { duration: 800 }); 
     $("#regsiterbox").hide(); 
     $(".login a").css("color", "#bf1e1a"); 
     $(".create-account a").css("color", "#747474"); 
    } 
    function showregister(){ 
     $("#regsiterbox").animate({"height": "toggle"}, { duration: 800 }); 
     $("#loginbox").hide(); 
     $(".create-account a").css("color", "#bf1e1a"); 
     $(".login a").css("color", "#747474"); 
    } 
    //]]> 
</script> 
<!---dropdown---> 

Любая помощь будет оценен по достоинству!

Answer 1

попробовать это

$('body').on('click',function(){ 
    if($("#regsiterbox").css('display') != "none"){ 
      $("#regsiterbox").hide(); 
    } 
    else if($("#loginbox").css('display') != "none"){ 
      $("#loginbox").hide(); 
    } 
}); 

Answer 2

Добавить класс .modal каждое всплывающего окна у вас есть на странице и добавить следующее. Он будет скрывать любое всплывающее окно с классом .modal при нажатии.

$('body').on('click',function(){ 
    if(!$(this).hasClass('modal')){ 
     $(".modal").hide(); 
    } 
}); 

Answer 3

Вы можете определить свое всплывающее окно по классу, я выбрал popup здесь. Этот код скроет элемент класса popup всякий раз, когда клик будет сделан за его пределами. Так что щелчки по окну не закрывают его.

$("body").click(function() { 
    if ($(this).attr("class") != "popup") { 
     $(".popup").hide(); 
    } 
}); 

Answer 4

$('body').on('click',function(event){ 
    event.stopPropagation();  
    $(".your_popup").hide(); 
});