JQuery实现点击div以外的位置隐藏该div窗口

  jquery实现鼠标点击div外的地方div窗口隐藏消失的

  

复制代码 代码如下:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <title>网页特效展示中心</title>

  <style type="text/css">

  .pop { width:200px; height:130px; background:#080;}

  </style>

  </head>

  <body>

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

  <script type="text/javascript">

  $(function(){

  $(document).bind("click",function(e){

  var target = $(e.target);

  if(target.closest(".pop").length == 0){

  $(".pop").hide();

  }

  })

  })

  </script>

  <div class="pop"></div>

  点击空白的地方指定div 隐藏消失了

  </body>

  </html>

  

复制代码 代码如下:

  class="bigPic"的div是被显示或隐藏的div,另外.case > ul > li是class="bigPic"的父级元素

  $("body").bind("click",function(evt){

  if($(evt.target).parents(".case > ul > li").length==0)

  {

  $('.bigPic').hide();

  }

  });