<html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title>网页特效展示中心</title>

 <style type="text/css">

 #testa,#testa2{position:relative;}

 #pop,#pop2 { width:100px; height:130px; position:absolute; left:0px; top:20px; border:solid red 1px;background:white; z-index:9999;}

 </style>

 </head>

 <body>

 <script type="text/javascript" src="cxx/jquery.min.js"></script>

 <script type="text/javascript">

 function toggle(id)

 {

 var id = document.getElementById(id);

 if(id.style.display == 'none')

 {

 id.style.display = 'block'

 }

 else

 {

 id.style.display = 'none';

 }

 }

 function dealBlankDivHide(e, id ,destinationid)

 {

 var target = $(e.target);

 if(target.closest("#"+id).length == 0){

 var id = document.getElementById(destinationid);

 if(id.style.display == 'block')

 {

 id.style.display = 'none'

 }

 }

 }

 $(function(){

 $(document).bind("click",function(e){

 dealBlankDivHide(e, 'testa','pop');

 dealBlankDivHide(e, 'testa2','pop2');

 })

 })

 </script>

 <span id="testa">

 <a onclick="toggle('pop')">onclick</a>

 <div id="pop" style="display:none;">

 <input type="checkbox" name = "test1"/>test1

 <input type="checkbox" name = "test2"/>test2

 <input type="checkbox" name = "test3"/>test3

 <input type="checkbox" name = "test4"/>test4

 <input type="checkbox" name = "test5"/>test5

 </div>

 <span>

 <span id="testa2">

 <a onclick="toggle('pop2')">onclick</a>

 <div id="pop2" style="display:none;">

 <input type="checkbox" name = "test1"/>test11

 <input type="checkbox" name = "test2"/>test22

 <input type="checkbox" name = "test3"/>test33

 <input type="checkbox" name = "test4"/>test44

 <input type="checkbox" name = "test5"/>test55

 </div>

 <span>

 </br>

 fsdfsdfsfsfsdfsfddf</br>

 fsdfsdfsfsfsdfsfddf</br>

 fsdfsdfsfsfsdfsfddf</br>

 fsdfsdfsfsfsdfsfddf</br>

 fsdfsdfsfsfsdfsfddf</br>

 fsdfsdfsfsfsdfsfddf</br>

 </body>

 </html>

jquery点击div以外的区域触发事件的更多相关文章

  1. 三种方法教你HTML实现点击某一个元素之外触发事件

    HTML实现点击某一个元素之外触发事件 大致编写的HTML界面渲染后是这个样子的,我们现在想要实现的需求是点击Button所在的div不会触发事件,而在点击Button所在的div之外的区域时会触发事 ...

  2. jQuery实现点击div外的区域，来隐藏指定节点

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script sr ...

  3. Jquery点击div之外的地方隐藏当前div

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script sr ...

  4. 怎么点击div之外的区域就隐藏这个div啊 找了很久，都没有很好解决

    方法一. <!DOCTYPE html><html><head><meta http-equiv="Content-Type" conte ...

  5. jQuery点击div其他地方隐藏div

    $(document).bind("click",function(e){ var target = $(e.target); ){ $("#regionlist&quo ...

  6. jQuery监听文本框值改变触发事件（propertychange）

    完整代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w ...

  7. 【转载】jquery实现勾选复选框触发事件给input赋值+回显复选框

    引用:https://blog.csdn.net/rui276933335/article/details/45717461 JSP: <td class="as1"> ...

  8. 深入A标签点击触发事件而不跳转的详解

    本文介绍下,当点击A标签时,触发事件但不跳转的实现方法,有需要的朋友参考下吧. 点击页面上的空链接,点击后页面自动刷新,并会定位到页面顶端. 不过,有时需要点击#页面但不作跳转,可以这样写: < ...

  9. target属性用于返回最初触发事件的DOM元素。

    target属性用于返回最初触发事件的DOM元素. 在HTML文档中,我们为<p>元素绑定点击事件("click"),由于DOM元素的事件冒泡机制,我们点击<p& ...

随机推荐

  1. sql中的SET NOCOUNT ON/OFF

    当 SET NOCOUNT 为 ON 时,不返回计数(表示受Transact-SQL 语句影响的行数). 当 SET NOCOUNT 为 OFF 时,返回计数(默认为OFF). 即使当 SET NOC ...

  2. SVN使用（自己总结）

    1.第一次导入,注意要新建个readme.txt文件用于记录版本更改,每次导入时 要填写import message 2.第二次增加文件导入时 勾选未受控版本文件(新增加文件) 完成上传就可更新增加的 ...

  3. Codeforces Round #297 (Div. 2) 525D Arthur and Walls(dfs)

    D. Arthur and Walls time limit per test 2 seconds memory limit per test 512 megabytes input standard ...

  4. JS高程3：Ajax与Comet-进度事件、跨源资源共享

    有以下 6 个进度事件  loadstart:在接收到响应数据的第一个字节时触发.  progress:在接收响应期间持续不断地触发.  error:在请求发生错误时触发.  abort:在因 ...

  5. Python学习之warn()函数

    warn()函数位于warnings模块中,用来发出警告,或者忽略它或引发异常. def warn(message, category=None, stacklevel=, source=None) ...

  6. 简单讲一下 SpringMVC的执行流程?

    执行流程: 1. 用户向服务器发送请求,请求被 Spring 前端控制 Servelt DispatcherServlet 捕获(捕获) . DispatcherServlet对请求  URL进行解析 ...

  7. PHP学习笔记（8）验证码使用session对比

    知识点: 1. session获取其他页面的变量: (1)先在画验证码php里开启session_start(),$_SESSION['随便起名']=验证码字符串, (2)再在submit提交到act ...

  8. The Definitive Guide To Django 2 学习笔记(八） 第四章 模板 （四）基本的模板标签和过滤器

    标签 下面的部分概述了常见的Django标签. if/else {%if%} 标签 对一个变量值进行测试,如果结果为true,系统将会显示在{%if%} 和 {%endif%}之间的一切,看个例子: ...

  9. The Definitive Guide To Django 2 学习笔记(七） 第四章 模板 （三）使用模板系统

    接下来,我们开始学习如何使用模板系统,但我们并不和前面说的View相结合,我们的这里的目的是展示模板系统是如何独立于Django框架运行的.下面是在pyhon代码中使用Django模板系统的基础例子: ...

  10. Java 使用 HttpClient调用https 最新源码 JDK7+ apache4.3+

    在项目使用https方式调用别人服务的时候,以前要写很多的代码,现在框架封装了很多,所以不用再写那么多了. 网上看了一下,都是很老的版本,用过时的DefaultHttpClient. 以spring为 ...