当前位置: 代码迷 >> Web前端 >> 点击其他地方暗藏popup窗口
  详细解决方案

点击其他地方暗藏popup窗口

热度:79   发布时间:2012-09-02 21:00:34.0
点击其他地方隐藏popup窗口

现在系统有一个弹出的日期选择窗口, 要求在窗口弹出后, 点击窗口以外的地方,窗口要隐藏

?

解决方法代码

?

?

              $("#dateimg").click(
                     function(event){
                         new Calendar(null, null, 0).show($("#dateinput")[0],$("#dateimg")[0]); 
                         event.stopPropagation();
                     }
              );
              
              $("html").bind("click", function(){
                  if($("#__calendarPanel").is(":visible")){
                        $("#__calendarPanel").hide();
                  }
              });

$("#__calendarPanel").bind("click", function(event){event.stopPropagation();});

?

__calendarPanel是弹出窗口的div id

实际上就是在整个页面范围内绑定点击事件,?

dateimg是图片, 点击它就会弹出窗口,之所以加

event.stopPropagation();

是为了阻止事件向上传播到html,假如传播到html的话 窗口一弹出马上又会隐藏的

?

?

?

$("#__calendarPanel").bind("click", function(event){event.stopPropagation();});

这句是说在窗口内部阻止事件向上传播, 阻止html的click事件,不然窗口就没法用了,因为一点就会隐藏,

但是在我自己的代码中,没有加这句话也没事,应该是因为弹出的div里面包着的是一个iframe, 我的点击实际上发生在ifame里, 那么html .click事件没有绑到iframe上?!

?

?

?