单击网站中的任何位置时如何关闭弹出窗口

时间:2013-09-19 06:46:06

标签: jquery html css

我想在用户点击正文中的任意位置时关闭弹出式广告。

这是我的网站http://daplonline.in/。我想在用户点击网站的任何位置时隐藏或关闭广告。

这是弹出式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 个答案:

答案 0 :(得分:5)

检查此代码100%正常运行并经过测试.. :)

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

     $('#wd1_nlpopup_overlay').hide();
     $('#wd1_nlpopup').hide();
    });
});

答案 1 :(得分:2)

您需要将选择器编辑到下面,

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

因为实际上你点击的是叠加而非身体。

现在由于此弹出窗口可能会在以后加载,因此您需要委托事件处理程序,如下所示

$(function()
{
    $(document).on('click',"#wd1_nlpopup_overlay",function(){
        alert("me");
    });
})

答案 2 :(得分:1)

我觉得将click事件发送给close弹出窗口btn。你可以这样做:

$("#wd1_nlpopup_overlay").click(function(){
   $("#wd1_nlpopup_close").click(); // <--this will fire an event to the closebtn
});

答案 3 :(得分:0)

您好,您忘记了jQuery文档初始化程序。试试这个:

$(document).ready(function() {
    $("body").click(function(){
      $("#wd1_nlpopup_close").click();
    });
});

答案 4 :(得分:0)

$('body').on('click', function(event){
    var popup = $('#wd1_nlpopup');
    if($(event.target).not(popup)){
        $(popup).hide();
    }
});

答案 5 :(得分:0)

您可以使用

隐藏或删除弹出窗口
$('#your-id').hide();

$("#your-id").remove();

答案 6 :(得分:-1)

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');
            }
               }
              );