Закрыть всплывающее окно, нажав на тело

Question

Я поместил javascript и css во всплывающее окно в приложении magento. Я могу закрыть всплывающее окно, нажав кнопку «Закрыть» во всплывающем окне, но если пользователь щелкает в другом месте (вне всплывающего окна) на всплывающем окне, оно должно быть закрыто.

Answer 1

Может быть, это поможет вам.Я бы порекомендовал jQuery, но если вы не можете его использовать, может быть, это решение для вас.

 <script type="text/javascript">
    document.onclick=check;
    function check(e){
    var target = (e && e.target) || (event && event.srcElement);
    var obj = document.getElementById('body');
    if(target!=obj){obj.style.display='none'}
    }
  </script>

И если вам нужно «переключить», возможно, это вам поможет:

<script type="text/javascript">
  document.onclick=check;
  function check(e){
    var target = (e && e.target) || (event && event.srcElement);
    var obj = document.getElementById('mydiv');
    var obj2 = document.getElementById('sho');
    if(target!=obj&&target!=obj2){
      obj.style.display='none'
    }
    else if(target==obj2){
      obj.style.display='block'
    }
    }
    </script> 

Answer 2

См. Этот вопрос: Используйте jQuery, чтобы скрыть DIV, когда пользователь нажимает за его пределами

var mouse_is_inside = false;

$(document).ready(function()
{
    $('.form_content').hover(function(){ 
        mouse_is_inside=true; 
    }, function(){ 
        mouse_is_inside=false; 
    });

    $("body").mouseup(function(){ 
        if(! mouse_is_inside) $('.form_wrapper').hide();
    });
});

Таким образом, вы проверяете, находится ли мышь внутри вашего всплывающего элемента div, и когда оннет, вы закроете его по клику.Если вы предоставите больше кода, мы поможем вам настроить его