Как закрыть всплывающее окно при нажатии в любом месте на сайте

0

Я хочу закрыть всплывающее объявление, когда пользователь нажимает в любом месте тела.

Это мой сайт http://daplonline.in/. Я хочу скрыть или закрыть объявление, когда пользователь нажимает в любом месте сайта.

Это код popup html:

<div style="top: 100px; background-color: rgba(5, 5, 0, 0.7); display: block;" id="wd1_nlpopup" data-expires="30" data-delay="10">
    <div id="overlay">
        <a href="#closepopup" id="wd1_nlpopup_close">x</a>
        <div class="content">  
            <a href="buyonline.php"><img src="images/online_course.gif"/></a>
        </div>                  
    </div>
</div>

Это код JavaScript:

<script type="text/javascript">
    $("body").click(function(){
        alert("me");
    });
</script>
Теги:

7 ответов

5
Лучший ответ

Проверьте этот код на 100%, работая и протестировав.. :)

$( document ).ready(function() {
$('#wd1_nlpopup_overlay').click(function() {

     $('#wd1_nlpopup_overlay').hide();
     $('#wd1_nlpopup').hide();
    });
});
Поделиться
  • 0
    ваш код работает, я добавил <script type="text/javascript"> $(document).ready(function() { $("body").click(function(){ $('#wd1_nlpopup').hide(); $('#wd1_nlpopup_overlay').hide(); }); }); </script> и работает отлично, спасибо
2

Вам нужно изменить свой селектор ниже,

$(function(){
   $("#wd1_nlpopup_overlay").click(function(){
      alert("me");
   });
})

потому что на самом деле вы нажимаете на наложение не на тело.

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

$(function()
{
    $(document).on('click',"#wd1_nlpopup_overlay",function(){
        alert("me");
    });
})
Поделиться
  • 0
    спасибо, но не работаю я могу видеть и предупреждать я хочу закрыть объявление, когда пользователь нажимает в любом месте тела, а не на закрывающемся всплывающем изображении
  • 0
    @vivek посмотрите код делегирования события и попробуйте ... и, как я уже сказал, ваше наложение скрывает тело, поэтому вам нужно добавить код для клика наложения ....
Показать ещё 2 комментария
1

Что мне кажется, чтобы дать событие click для закрытия всплывающего окна btn. Вы можете сделать это следующим образом:

$("#wd1_nlpopup_overlay").click(function(){
   $("#wd1_nlpopup_close").click(); // <--this will fire an event to the closebtn
});
Поделиться
  • 1
    Мне нравится такой подход к запуску события нажатия кнопки закрытия лучше, чем мое решение (которое должно было скрыть).
0

Вы можете скрыть или удалить всплывающее окно, используя

$('#your-id').hide();

или

$("#your-id").remove();
Поделиться
0

Привет, вы забываете инициализатор документа jQuery. попробуйте это вместо этого:

$(document).ready(function() {
    $("body").click(function(){
      $("#wd1_nlpopup_close").click();
    });
});
Поделиться
0

пытаться

$('body').on('click', function(event){
    var popup = $('#wd1_nlpopup');
    if($(event.target).not(popup)){
        $(popup).hide();
    }
});
Поделиться
-2

http://jsfiddle.net/jasonday/xpkFf/ он удалит всплывающее окно, если щелкнет в любом месте

$('#open').click(function() {
    $('#dialog').dialog('open');

});



$('#dialog').dialog({
    autoOpen: false,
    modal: false
});

// Close Pop-in If the user clicks anywhere else on the page
             jQuery('html') //set for html for jsfiddle, but should be 'body'
              .bind(
               'click',
               function(e){
            if(
             jQuery('#dialog').dialog('isOpen')
             && !jQuery(e.target).is('.ui-dialog, a')
             && !jQuery(e.target).closest('.ui-dialog').length
            ){
             jQuery('#dialog').dialog('close');
            }
               }
              );
Поделиться

Ещё вопросы

Сообщество Overcoder
Наверх
Меню