query 点击元素以外任意地方隐藏该元素的方法

第一先实现点击任何地方都隐藏该元素(假设id="bar")

$(document).click(function(){
$("#bar").hide();

});
那么bar也属于document,点击bar也会让自己隐藏,显然这不是想要的,这时候要阻止冒泡事件,即document的事件对bar无效
$("#bar").click(function(event){
event.stopPropagation();

});

原文地址:https://www.cnblogs.com/leonardchen/p/9600164.html

时间: 2024-10-10 04:21:16

query 点击元素以外任意地方隐藏该元素的方法的相关文章

点击除元素以外的任意地方隐藏元素js

比如想实现点击列表弹出筛选器,点击其他任意地方关闭筛选器,如图 该筛选器class名 $(document).click(function () {       $(".subMenu").hide(); });  $(".subMenu").on("click", function (event) {       //取消事件冒泡       var e = arguments.callee.caller.arguments[0] || eve

jquery实现点击页面其他地方隐藏指定元素

jquery实现点击页面其他地方隐藏指定元素:在很多效果中,都有这样的功能,当点击页面的其他地方时,能够隐藏一个指定的元素,例如在模拟实现的select下拉菜单效果中,当下拉菜单出现的时候,我们往往希望当点击页面其他地方的时候,能够隐藏下拉条,下面就通过一个实例单独介绍一下如何实现此功能.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name=

Jquery点击任意地方隐藏div

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <link rel="stylesheet" type="text/css" href="http://apps.bdimg.com/lib

点击页面其它地方隐藏该div的方法

思路一 第一种思路分两步 第一步:对document的click事件绑定事件处理程序,使其隐藏该div 第二步:对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而调用document的onclick方法隐藏了该div. <script type="text/javascript"> function stopPropagation(e) { if (e.stopPropagation) e.stopPropagation(); else

点击任何位置隐藏所需隐藏的元素 (无BUG/jQuery版)

1>第一种分两步 1) :对document的click事件绑定事件处理程序,使其隐藏该div 2) :对div的click事件绑定事件处理程序,阻止事件冒泡,防止其冒泡到document,而调用document的onclick方法隐藏了该div. 1 <script type="text/javascript"> 2 function stopPropagation(e) { 3 if (e.stopPropagation) 4 e.stopPropagation(

CSS实现控制元素的显示和隐藏

1 使用label + input实现元素的隐藏和显示 以下代码点击‘菜单’可以实现li列表的显示和隐藏: <style type="text/css"> *{ margin: 0; padding: 0; } input, ul{ display: none; } input:checked ~ ul { display: block; } </style> <body> <label for="menu">菜单&l

jQuery判断元素是否显示与隐藏

jQuery判断一个元素是显示还是隐藏,jQuery使用is()方法来判断一个元素是否显示,反之则为隐藏 核心代码 if($("#username").is(":hidden")){ } 实例代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>test.html</ti

jquery实现的点击页面其他地方隐藏显示的元素

jquery实现的点击页面其他地方隐藏显示的元素:在实际应用中,可能有这样的效果,那就是有这样一个弹出层,点击层本身的时候,这个层不会隐藏,而点击除去层之外的页面其他地方则会将这个层隐藏,下面就通过代码实例介绍一下如何实现此效果.代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="

点击div和某些控件之外的地方隐藏div,点击div不隐藏。对象 click和document click冲突有关问题

帮朋友解决这个问题,我发现用以往想想像的方式来实现,貌似不太可行,所以从网上找了一些解决办法,进行优化,这篇比较详细,所以拿来备忘,另一方面也希望可以帮助需要的同学! 问题背景:jQuery事件问题!!对象 click和document click冲突问题 我想点击某个元素显示一个对象, 点击页面任意处,隐藏这个对象 //点击look对象,显示隐藏mydiv $("#look").bind("click", function () {      $("#m