jquery实现点击div外隐藏div
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的更多相关文章
- jquery点击非div区域隐藏div
点击非div区域隐藏div,如图,点击圆的头像(.person-msg)弹出白色底框(.person-centre).点击圆头像以外的区域隐藏白色底框
- 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡
点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...
- 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- 纯CSS实现点击事件展现隐藏div菜单列表/元素切换
在写移动端导航的时候经常用到点击按钮出现/隐藏导航条的情况,最常见的方法当然还是前端框架直接调用,省心省力,不易出错:当然还有使用纯JS实现的小代码段.我这里整理了纯CSS实现方式,给需要的人和给自己 ...
- 点击区域外隐藏该区域,event.stopPropagation()
event.stopPropagation() Description: Prevents the event from bubbling up the DOM tree, preventing an ...
- js实现的点击div区域外隐藏div区域
首先看下JS的事件模型,JS事件模型为向上冒泡,如onclick事件在某一DOM元素被触发后,事件将跟随节点向上传播,直到有click事件绑定在某一父节点上,如果没有将直至文档的根. 阻止冒泡:1.对 ...
- React 点击按钮显示div与隐藏div,并给div传children
最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...
- 点击自动显示/隐藏DIV代码。(简单实用)
注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 很多时候我们需要将DIV的信息默认为隐藏状态,只有当用户点击时才显示DIV中包含的提示文字.这类效果在互联网上应用得很多,但实现的方 ...
- JQ 点击指定文本框显示div。点击其他区域隐藏DIV
<input id="username" type="text" style="width:90%;margin-top: 40px;" ...
随机推荐
- js排序与重组
前几天同学发给我一个问题,思路想整理一下,也供大家参考.实际上这道题本质就是考察的是去重与排序的问题.好了闲话少说,上题. function input(req){ if(req<=10 ...
- .NET Core+Selenium+Github+Travis CI => SiteHistory
前言 总是三分钟热度的我折腾了一个可以每天自动截取指定网站页面并保存到Github的项目SiteHistory,感觉挺好(每次都这样). 想知道YouTube今天的首页长啥样么?点此查看 想知道You ...
- AndroidTv Home界面实现原理(一)——Leanback 库的使用
接下去应该是梳理一下 Android Tv 主界面实现原理及解析的一个系列博客了,大体上的安排是先介绍 Google 官方提供的 Leanback 库的使用,如何使用该库来实现简单的 Home 界面, ...
- 深入浅出数据结构C语言版(15)——优先队列(堆)
在普通队列中,元素出队的顺序是由元素入队时间决定的,也就是谁先入队,谁先出队.但是有时候我们希望有这样的一个队列:谁先入队不重要,重要的是谁的"优先级高",优先级越高越先出队.这样 ...
- jQuery与js的length属性
js:length 属性可返回字符串中的字符数目. stringObject.length jQuery:length 属性包含 jQuery 对象中元素的数目. $(selector).length ...
- 学习Java第一天,大致了解
第一章: java核心 1 了解 java的产生背景 2 了解java的体系结构和组成 3 了解java程序的编写 编译 运行 4 掌握java的 api文档的使用 5 了解 jdk的组成 1. ja ...
- TFLearn构建神经网络
TFLearn构建神经网络 Building the network TFLearn lets you build the network by defining the layers. Input ...
- Freemarker的使用方法
1. Freemarker概念 1.1 什么是freemarker FreeMarker是一个用Java语言编写的模板引擎,它基于模板来生成文本输出.FreeMarker与Web容器无关,即在Web运 ...
- shell变量$(CURDIR),$0,$1,$2,$#含义解释
$(CURDIR): CURDIR是make的内嵌变量, 为当前目录 实例 SRCTREE := $(CURDIR) *$(CURDIR)为当前目录,相当于SRCTREE=./ MKCONFIG ...
- Rehat一键安装mysql脚本和备份数据库脚本
Rehat一键安装mysql脚本 ##说明:适用,Rehat 5 6 7 1.运行状态,运行成功输出mysql临时密码 2.代码如下 #!/bin/bash #获取系统信息 sudo cat /etc ...