jquery实现除指定区域外点击任何地方隐藏DIV
<!--弹出的表情选择框-->
<div class="layui-input-block expression-box">
</div>
<div class="layui-input-block" style="width: 600px; margin: 0 auto; border-left: 1px solid #4a4f58; border-right: 1px solid #4a4f58;">
<i title="表情" class="layui-icon layui-icon-face-smile" style="font-size: 30px; color: #1E9FFF; margin-right: 10px; cursor: pointer;" onclick="showEmotionDialog();"></i>
<i title="文件" class="layui-icon layui-icon-file" style="font-size: 30px; color: #1E9FFF; margin-right: 10px; cursor: pointer;" onclick="selectFileClick()"></i>
<i title="图片" class="layui-icon layui-icon-picture" style="font-size: 30px; color: #1E9FFF; cursor: pointer;" onclick="selectPicClick()"></i>
</div>
$(document).click(function (e) {
var $target = $(e.target);
//点击表情选择按钮和表情选择框以外的地方 隐藏表情选择框
if (!$target.is('.expression-box *') && !$target.is('.chat-bottom-box i[title="表情"]')) {
$('.expression-box').hide();
}
});
jquery实现除指定区域外点击任何地方隐藏DIV的更多相关文章
- 点击其它地方隐藏div/事件冒泡/sweet-alert阻止冒泡
点击document时把div隐藏,但点击div时阻止点击事件冒泡到document,从而实现“点击文档其它地方隐藏div,点击div本身不隐藏”.js代码如下:$("#div") ...
- 点击除指定区域外的空白处,隐藏div
<script> $(document).click(function (e) { var $target = $(e.target); //点击.zanpl和.quanzipl以外的地方 ...
- jquery点击其他地方隐藏div层的实现程序
js代码 $(document).ready(function() { //语言头部的点击事件,显示语言列表 $(".language_selected").click(funct ...
- 点击其他地方隐藏div
document.onclick = function(e){ var ele = e?e.target:window.event.srcElement; if(ele.id !== 'valueSh ...
- js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div
点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...
- Jquery手机点击其他地方隐藏控件问题
因为不太懂mui的底部导航栏的操作,所以自己写了用很普通的方法实现手机底部导航栏,遇到了很多问题.比如:要实现点击底部菜单栏上某一个菜单,显示子菜单,然后点击手机空白处,隐藏菜单. 实现方法是: // ...
- 点击其它地方关闭DIV
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 点击按钮显示隐藏DIV,点击DIV外面隐藏DIV
点击按钮显示隐藏DIV,点击DIV外面隐藏DIV 注意:此方法对touch事件不行,因为stopPropagation并不能阻止touchend的冒泡 <style type="tex ...
- 纯CSS实现点击事件展现隐藏div菜单列表/元素切换
在写移动端导航的时候经常用到点击按钮出现/隐藏导航条的情况,最常见的方法当然还是前端框架直接调用,省心省力,不易出错:当然还有使用纯JS实现的小代码段.我这里整理了纯CSS实现方式,给需要的人和给自己 ...
随机推荐
- TX2 刷机时遇到Parsing board information failed
因为之前调试I2C时,修改了EEPROM Layout,所以,在刷机时遇到此问题. 解决办法是按照此文档中的介绍来修改布局. 实际操作时,我拿了一块正常的TX2,按照指令: sudo i2cdump ...
- [转] org.scalatest.FunSuite Scala Examples - Scala FunSuite 测试的例子
[From] https://www.programcreek.com/scala/org.scalatest.FunSuite org.scalatest.FunSuite Scala Examp ...
- netty用户指南
Netty用户指南 一.前言 1.问题 当今世界我们需要使用通用的软件或库与其他组件进行通信,例如使用HTTP客户端从服务器中获取信息,或通过网络服务调用一个远程的方法.然而通用的协议及其实现通常不具 ...
- Android开发不可或缺的十大网站及工具
1. Google 做开发前完全是小白,真心不知道有Google这东西,只晓得百度,遇到问题直接百度,不是黑百度,百度在娱乐八卦方面确实靠谱,但是技术方面查出来的东西基本千篇一律,有些答案甚至还会起到 ...
- python的socket.recv函数陷阱
目录 前言 一个粘包实验 执行结果 排错思路 解决和总结 前言 惯例练习历史实验,在编写tcp数据流粘包实验的时候,发现一个奇怪的现象.当远程执行的命令返回结果很短的时候可以正常执行,但返回结果很长时 ...
- 利用setTimeout来实现setInterval
在Js中,当我们要在一定间隔时间内不断执行同一函数,我们可以使用setInterval函数,但setInterval在某些情况下使用时也存在一定问题. 1.不去关心回调函数是否还在运行 在某些情况下, ...
- Ubuntu14.04下Cloudera安装搭建部署大数据集群(图文分五大步详解)(博主强烈推荐)(在线或离线)
第一步: Cloudera Manager安装之Cloudera Manager安装前准备(Ubuntu14.04)(一) 第二步: Cloudera Manager安装之时间服务器和时间客户端(Ub ...
- ThreadPoolExecutor 杂记
When a new task is submitted in method execute(Runnable), and fewer than corePoolSize threads are ru ...
- ognl,jstl,struts2标签中符号#,$,%的用法
STRUTS2标签操作Map <s:iterator value="sundayMap"> <td colspan="7" ...
- Group by、having、order by、Distinct 使用注意事项
直奔主题,如下SQL语句 SELECT COUNT(*) AS COUNT,REQUEST,METHOD FROM REQUESTMETH GROUP BY REQUEST,METHOD HAVING ...