点击div外面隐藏弹窗

//点击div外面隐藏弹窗
function click_out_div(){
 $(document).bind("click",function(e){
  var target = $(e.target);
  if(target.closest("#select_div").length == 0){//点击div之外的地方触发
       $("#select_div").hide();
  }
 });
}

时间: 2024-10-13 03:38:20

点击div外面隐藏弹窗的相关文章

点击按钮显示隐藏DIV,点击DIV外面隐藏DIV

注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="text/css"> body { background-color:#999999; } #myDiv { background-color:#FFFFFF; width:250px; height:250px; display:none; } </style> <body> <input id="btn&

点击div和某些控件之外的地方隐藏div,点击div不隐藏。对象 click和document click冲突有关问题

帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学! 问题背景:jQuery事件问题!!对象 click和document click冲突问题 我想点击某个元素显示一个对象, 点击页面任意处,隐藏这个对象 //点击look对象,显示隐藏mydiv $("#look").bind("click", function () {      $("#m

点击div外面该div消失(二)

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-2.2.2.min.js"></script> <style type="text/css">

点击同一按钮实现div的隐藏与现实切换

点击同一按钮实现div的隐藏与现实切换:在很多应用中,都有这样的功能,点击同一个按钮可以实现div的隐藏或者现实,当然操作的并非必须是按钮或者div,不过原理是一样的,下面就通过代码实例介绍一下如何实现此功能.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://ww

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

简单示例代码: <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&

jquery点击非div区域隐藏div

点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框 html代码 <div class="per_c"> <div class="person-msg pull-right"> <img src="../../res/images/snow_man.jpg"> </div> <dl class=

点击按钮对两个div的隐藏与显示进行切换

HTML: <button type="button"  id="showHidden">点击切换div的隐藏与显示</button> <div id="div1">请叫我第一层</div> <div id="div2">请叫我第二层</div> JS: <script type='text/javascript'> function show

点击区域外隐藏该区域,event.stopPropagation()

event.stopPropagation() Description: Prevents the event from bubbling up the DOM tree, preventing any parent handlers from being notified of the event. 点击区域外隐藏该区域Example: 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta content="chars

点击按钮实现隐藏和显示的切换代码

点击按钮实现隐藏和显示的切换代码:在不少应用中,都有这样的功能,点击同一个按钮可以实现一个元素的显示和隐藏的切换,下面就通过代码实例介绍一下如何实现此效果,代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> &