html

<div style="width:100px;height:100px;border:1px solid #ff0" id="div">div</div>

js

document.on("click",function(e){

if($(e.target).closest("#div").length=0){

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

}

})

jquery实现点击div外隐藏div的更多相关文章

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

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

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

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

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

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

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

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

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

    event.stopPropagation() Description: Prevents the event from bubbling up the DOM tree, preventing an ...

  6. js实现的点击div区域外隐藏div区域

    首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...

  7. React 点击按钮显示div与隐藏div,并给div传children

    最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...

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

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

  9. JQ 点击指定文本框显示div。点击其他区域隐藏DIV

    <input id="username" type="text" style="width:90%;margin-top: 40px;" ...

随机推荐

  1. redux源码解读

    react在做大型项目的时候,前端的数据一般会越来越复杂,状态的变化难以跟踪.无法预测,而redux可以很好的结合react使用,保证数据的单向流动,可以很好的管理整个项目的状态,但是具体来说,下面是 ...

  2. QQ推广神器:批量加群、好友、群发。支持批量搜索关键词加群分享下载

    V2.1版本更新说明: 1.新增邮箱导出功能 2.新增一键添加关键词查询结果所有群 3.新增好友验证数学自动计算 4.新增好友验证答案判断 ------------------------------ ...

  3. kali系统:局域网arp欺骗, 搞定任意windows计算机

    目的 通过Arp欺骗, 给局域网内的所有用户网页中植入木马, 只要用户运行以后, 就会反弹一个shell到我们计算机 准备 kali系统 metaspolit的使用 Arp欺骗工具:bettercap ...

  4. 面试技巧,如何通过索引说数据库优化能力,内容来自Java web轻量级开发面试教程

    上星期写了一个篇文章,数据库方面的面试技巧,如何从建表方面展示自己能力,承蒙管理员抬举,放入首页,也承蒙各位厚爱,两天内收获了将近770个点击,也一度进入48小时热榜. 为了感谢管理员和大家的支持,再 ...

  5. 报表 jasper + ireport5.6

    下载 iReport-5.6.0,jdk7,以及众多lib , 这里我提供下资源(我的百度云) 安装好iReport-5.6.0和jdk7,  在安装目录的\etc\ireport.conf,修改其中 ...

  6. [2017-08-25]100行CSharp代码利用dynamic写个DSL(特定领域语言)

    最近看<CLR via C#(第4版)> 读到第五章末尾dynamic基元类型时,看了下作者的一个利用dynamic动态调用string类型的Contains方法(静态方法)的实现,突然发 ...

  7. Tornado框架简介(二)

    --------------------Application-------------------- 1.settings     1.debug=True:,设置tornado是否工作在调试模式, ...

  8. sed修炼系列(四):sed中的疑难杂症

    本文目录:1 sed中使用变量和变量替换的问题2 反向引用失效问题3 "-i"选项的文件保存问题4 贪婪匹配问题5 sed命令"a"和"N" ...

  9. vue 父子组件传参

    父向子组件传参 例子:App.vue为父,引入componetA组件之后,则可以在template中使用标签(注意驼峰写法要改成componet-a写法,因为html对大小写不敏感,component ...

  10. C++学习日记(二)————初始字符串类型

    使用频率高,但操作复杂的数据有哪些? 做下总结: int; double;float;char;bool这些类型用的比较频繁,但并不复杂.但对于字符串来说(char数组)用的频繁但操作又复杂,只能用一 ...