jQuery点击div以外的地方隐藏div

简介:

jQuery点击div以外的地方隐藏div


首先点击显示某个div,然后要求再次点击时消失,或者点击document的其他地方会隐藏掉这个层,涉及到冒泡的问题,阻止document冒泡到dom上。代码如下:


1
2
3
4
5
6
7
8
9
10
11
var  $el = $( ".search-more, .article-query-list li" );
$el.click( function (e){
e.stopPropagation();
$( this ).toggleClass( 'active' );
});
$(document).on( 'click' , function (e){
if (($(e.target) != $el) && ($el.hasClass( 'active' ))){
$el.removeClass( 'active' );
// console.log("yes");
}
});


转载:

http://caibaojian.com/jquery-toggle-div.html





   本文转自许琴 51CTO博客,原文链接:http://blog.51cto.com/xuqin/1574021,如需转载请自行联系原作者






相关文章
|
7月前
|
JavaScript
jQuery遍历div,判断是否为空,为空时执行某个操作
jQuery遍历div,判断是否为空,为空时执行某个操作
|
7月前
|
JavaScript
用JQuery实现选中select里面的option显示对应的div
用JQuery实现选中select里面的option显示对应的div
|
4月前
|
JavaScript Java
点击按钮,向下添加目录。Java script+jQuery写法
点击按钮,向下添加目录。Java script+jQuery写法
25 1
|
4月前
|
JavaScript Java
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
20 1
|
7月前
|
JavaScript 前端开发
【Web 前端】如何在点击一个按钮时使用 jQuery 隐藏一个图片?
【5月更文挑战第2天】【Web 前端】如何在点击一个按钮时使用 jQuery 隐藏一个图片?
|
7月前
|
JavaScript
jquery实现单击div切换背景,再次单击回到原来样式
jquery实现单击div切换背景,再次单击回到原来样式
|
7月前
|
JavaScript 前端开发
原生js与jQuery显示隐藏div的几种方法
原生js与jQuery显示隐藏div的几种方法
96 0
|
JavaScript 前端开发
jQuery点击图片来回切换功能
jQuery点击图片来回切换功能
100 0
jQuery点击图片来回切换功能
|
JavaScript 数据库
jQuery点击图片开启,再次点击图片关闭效果
jQuery点击图片开启,再次点击图片关闭效果
49 0
|
JavaScript
jquery实现点击图片切换为另一图片,再次点击恢复到原图片
jquery实现点击图片切换为另一图片,再次点击恢复到原图片
136 0