JQuery控制div外点击隐藏而div内点击不会隐藏的方法

 更新时间:2015年01月13日 14:37:43   投稿:shichen2014  
这篇文章主要介绍了JQuery控制div外点击隐藏而div内点击不会隐藏的方法,涉及show、hide及stopPropagation等方法的使用技巧,需要的朋友可以参考下

本文实例讲述了JQuery控制div外点击隐藏而div内点击不会隐藏的方法。分享给大家供大家参考。具体如下:

比如有个div其id为body,实现在div外点击隐藏,div内点击不隐藏,采用jQuery实现如下:

复制代码 代码如下:
$("#body").click(function(e) { 
    $(this).show(); 
        e.stopPropagation(); 
}); 
$(document).click(function(event) { 
 
    $("#body").hide(); 
});

如果div内点击隐藏,可采用jQuery的触发事件

复制代码 代码如下:
$(document).trigger("click");

希望本文所述对大家的jQuery程序设计有所帮助。

相关文章

  • jQuery操作选中select下拉框的值代码实例

    jQuery操作选中select下拉框的值代码实例

    这篇文章主要介绍了jQuery操作选中select下拉框的值代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-02-02
  • jQuery实现布局高宽自适应的简单实例

    jQuery实现布局高宽自适应的简单实例

    下面小编就为大家带来一篇jQuery实现布局高宽自适应的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-05-05
  • jquery插件懒加载的示例

    jquery插件懒加载的示例

    这篇文章主要介绍了jquery插件懒加载的示例,帮助大家更好的利用jQuery制作网页,感兴趣的朋友可以了解下
    2020-10-10
  • jQuery实现动态向上滚动

    jQuery实现动态向上滚动

    这篇文章主要为大家详细介绍了jQuery实现动态向上滚动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • jQuery平滑旋转幻灯片特效代码分享

    jQuery平滑旋转幻灯片特效代码分享

    这篇文章主要介绍了jQuery平滑旋转幻灯片特效,一个具有自己特色的幻灯片会吸引用户的注意力,让用户产生浏览网站的兴趣至关重要,现在小编推荐给大家一款特别棒的幻灯片,感兴趣的小伙伴可以参考下。
    2015-09-09
  • jQuery 导航自动跟随滚动的实现代码

    jQuery 导航自动跟随滚动的实现代码

    这篇文章主要介绍了jQuery 导航自动跟随滚动的实现代码,需要的朋友可以参考下
    2018-05-05
  • bootstrap table 服务器端分页例子分享

    bootstrap table 服务器端分页例子分享

    这篇文章主要介绍了bootstrap table 服务器端分页例子分享,需要的朋友可以参考下
    2015-02-02
  • 为Jquery EasyUI 组件加上清除功能的方法(详解)

    为Jquery EasyUI 组件加上清除功能的方法(详解)

    下面小编就为大家带来一篇为Jquery EasyUI 组件加上清除功能的方法(详解)。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-04-04
  • jQuery setTimeout()函数使用方法

    jQuery setTimeout()函数使用方法

    setTimeout在以前的js中是定时执行一个对象或函数,下面我来介绍jquery中的setTimeout函数使用方法有需要了解的朋友仔细的参考参考
    2013-04-04
  • jQuery中hasClass()方法用法实例

    jQuery中hasClass()方法用法实例

    这篇文章主要介绍了jQuery中hasClass()方法用法,实例分析了hasClass()方法的功能、定义及验证匹配元素是否包含指定类的使用技巧,需要的朋友可以参考下
    2015-01-01

最新评论