<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-2.2.2.min.js"></script>
<style type="text/css">
.main {
width: 300px;
height: 300px;
background: red;
} .content {
width: 100px;
height: 100px;
background: blue;
}
</style>
<script type="text/javascript">

// $(function() { //方法一

// $("#showdiv").click(function(e) {

// if($("#test").is(":hidden")) {

// $("#test").fadeIn();

// e ? e.stopPropagation() : event.cancelBubble = true;

// }

// });

// $("#test").click(function(e) {

// e ? e.stopPropagation() : event.cancelBubble = true;

// });

// $(document).click(function() {

// $("#test").fadeOut();

// });

// })

// $(function(){ //方法二

// $("#showdiv").click(function(e){

// alert(e.target.className);

// if(e.target.className!=="content"){

// $("#test").hide();

//// $("#showdiv").hide();

// }

// })

// $("#test").click(function(){

// alert(1111);

// return false; //阻止事件冒泡到父级DIV

// })

// })

$(function(){ //方法三

$("#showdiv").click(function(){

$("#test").hide();

return false;

})

$("#test").click(function(){

return false;

})

})

<body>
<div id="showdiv" class="main">
<div id="test" class="content"> </div>
</div>
</body>

点击div外面该div消失的更多相关文章

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

    点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...

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

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. 21.JQ的监听事件(点击div外面可以让它消失)

    JQ的监听事件(点击div外面可以让它消失) //监听整个页面 $(document).bind("click", function() { //给需要的对象赋予事件 $(&quo ...

  4. 点击其它位置,div下拉菜单消失

    接下拉菜单那一篇: 加上点击其它位置,下拉菜单消失. 纯js写法: window.document.addEventListener('click', function(e) { var e = e ...

  5. 如何设计点击点击一个div,其他div做出对应反应,以及获取一个节点下的子节点

    <div id="show"> <div>1</div> <div>2</div> <div>3</d ...

  6. 点击自动显示/隐藏DIV代码。(简单实用)

    注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 很多时候我们需要将DIV的信息默认为隐藏状态,只有当用户点击时才显示DIV中包含的提示文字.这类效果在互联网上应用得很多,但实现的方 ...

  7. 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡

    点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...

  8. jquery点击非div区域隐藏div

    点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框

  9. 纯CSS实现点击事件展现隐藏div菜单列表/元素切换

    在写移动端导航的时候经常用到点击按钮出现/隐藏导航条的情况,最常见的方法当然还是前端框架直接调用,省心省力,不易出错:当然还有使用纯JS实现的小代码段.我这里整理了纯CSS实现方式,给需要的人和给自己 ...

随机推荐

  1. js中this对象,call,apply

  2. 在eclipse之中使用Junit

    使用Junit单位测试,能够一定程度上减小项目bug的产生.很多时候,我们都是在main函数里面单独去测试一个方法,这样的测试非常不方便.使用Junit可以是测试单位和项目代码分离,一次性测试多个方法 ...

  3. fastjson基本使用 (待大量完善)

    参考: http://blog.csdn.net/wx_962464/article/details/37612861 maven库下载 fastjson基本使用 import java.util.A ...

  4. java自带BASE64工具进行图片和字符串转换

    java自带BASE64工具进行图片和字符串转换 import java.io.File; import java.io.FileInputStream; import java.io.FileOut ...

  5. IE调试网页之四:F12 开发人员工具控制台错误消息 (Windows)(转载)

    F12 工具控制台可以报告在运行时期间发生的错误和信息消息.本文将介绍错误消息,并提供有关如何修正这些错误的建议. 简介 F12 工具控制台错误消息提供了一些代码(例如,SEC7111 或 HTML1 ...

  6. 连通图模板(HDU 1269)

    http://acm.hdu.edu.cn/showproblem.php?pid=1269 题目大意:给定一个图,判断该图是否是强连通图.(强连通图为从任意一点出发,可到达其他所有点).深搜的Tar ...

  7. 解析XML文件的几种常见操作方法—DOM/SAX/DOM4j

    解析XML文件的几种常见操作方法—DOM/SAX/DOM4j 一直想学点什么东西,有些浮躁,努力使自己静下心来看点东西,哪怕是回顾一下知识.看到了xml解析,目前我还没用到过.但多了解一下,加深点记忆 ...

  8. [R] 回归拟合

    如下示例 > fit <- lm(y~x, data = data01) > summary(fit) Call: lm(formula = data01$P ~ data01$M, ...

  9. 乐视云计算基于OpenStack的IaaS实践

    本文作者岳龙广,现在就职于乐视云计算有限公司,负责IaaS部门的工作. 从开始工作就混在开源世界里,在虚拟化方面做过CloudStack/Ovirt开发,现在是做以OpenStack为基础的乐视云平台 ...

  10. 水果项目第2集-建立数据库->编写数据访问基础类->实现类的方法->调试通过

    看来写博客对懒人也有好处.监督自己的好处. 今天一打开电脑,就想继续写了. 今天就开始动手做了. 数据库建立,编写访问数据库代码,实现各个类的方法,调试这些方法. 这些基础的代码写完后,就可以写逻辑代 ...