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. Mybatis 插入数据并返回刚刚插入的数据id

    1.在Mybatis Mapper文件中添加属性“useGeneratedKeys”和“keyProperty”,其中keyProperty是Java对象的属性名,而不是表格的字段名. 2.Mybat ...

  2. vue-cli脚手架npm相关文件解读(3)webpack.dev.conf.js

    系列文章传送门: 1.build/webpack.base.conf.js 2.build/webpack.prod.conf.js 3.build/webpack.dev.conf.js 4.bui ...

  3. 监听 window.open 打开的窗口关闭并回调

    第三方的登录的解决方案通常有两种方式,一是打开一个新的标签页,然后登录回调回来: 二是通过父窗口打开一个子窗体去第三方登录,登陆成功时关掉子窗体回到父窗口. 问题来了 我的父窗体怎么样才知道子窗体被关 ...

  4. “最美天气”Python抓取天气

    import urllib.request import urllib.parse import json """     利用"最美天气"抓取即时天 ...

  5. SpringMVC获取页面数据乱码的解决get/post

    一.post请求方式的乱码 在web.xml中加入: <filter> <filter-name>CharacterEncodingFilter</filter-name ...

  6. 环境配置-云服务器jdk与tomcat配置

    我所实践的主机是麻花疼云的主机,第一次试用30天,装了个centos6.5,其实已经用商用专用镜像配置好环境了,包括jdk.tomcat等常用的内容,但是我实在是找不到他们安装在哪个目录下了,我就自己 ...

  7. redis 安装及启动关闭

    1.redis下载 方式1:直接去官网下载 https://redis.io/download 方式2:通过命令下载 wget http://download.redis.io/releases/re ...

  8. Just for Today

    Just for today I will try to live through this day only and not tackle my whole life problem at once ...

  9. python基础教程(四)

    列表 本节继续讨论列表不同元组和字符串的地方:列表是可变的(mutable)----可以改变列表的内容,并且列表有很多有用的.专门的方法. List函数可以将一个字符串拆分成列表. >>& ...

  10. Centos 7服务启动文件

    在Centos 7中,如果要编辑一个脚本服务文件,并使用systemd进行管理,则必须将服务文件命名为/etc/systemd/system/*.service. service unit文件中的选项 ...