JS setCapture 区域外事件捕捉


Posted in Javascript onMarch 18, 2010

不过setCapture不支持键盘事件, 只能捕获以下鼠标事件:onmousedown、onmouseup、onmousemove、onclick、ondblclick、onmouseover和onmouseout。

程序中主要是要捕获onmousemove和onmouseup事件。

msdn的介绍中还说到setCapture有一个bool参数,用来设置在容器内的鼠标事件是否都被容器捕获。

参数为true时(默认)容器会捕获容器内所有对象的鼠标事件,即容器内的对象不会触发鼠标事件(跟容器外的对象一样);

参数为false时容器不会捕获容器内对象的鼠标事件,即容器内的对象可以正常地触发事件和取消冒泡。

object.setCapture() 当一个object的被 setCapture 后,他的方法将会被继承到整个文档进行捕获。当不需要把方法继承到整个文档捕获时,要用 object.releaseCapture() 来释放.

Mozilla 也有类似的功能,方法稍微不同

window.captureEvents(Event.eventType)

window.releaseEvents(Event.eventType)

事例:

<HTML> 
<BODY> 
<div id="m_Div" style="width:200px;height:200px;border:1px solid #b0bca5;padding:2px" onclick="alert('Hello')">点一下IE的菜单或者按钮看看:) 
又或者IE窗口外的地方</div> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
document.getElementById("m_Div").setCapture() 
//--> 
</SCRIPT> 
</BODY> 
</HTML>

在调用setCapture()后, 捕捉到事件后自动释放, 如果在连续对事件捕捉,需要在调用的事件里再次执行setCaptuer()
Javascript 相关文章推荐
用jscript实现列出安装的软件列表
Jun 18 Javascript
jquery之Document元素选择器篇
Aug 14 Javascript
JavaScript 选中文字并响应获取的实现代码
Aug 28 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
Aug 05 Javascript
ES6中如何使用Set和WeakSet
Mar 10 Javascript
jQuery easyui刷新当前tabs的方法
Sep 23 Javascript
微信小程序 网络请求(GET请求)详解
Nov 16 Javascript
详解webpack模块化管理和打包工具
Apr 21 Javascript
node+koa2+mysql+bootstrap搭建一个前端论坛
May 06 Javascript
微信小程序日期选择器实例代码
Jul 18 Javascript
bootstrap下拉框动态赋值方法
Aug 10 Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 Javascript
小议Javascript中的this指针
Mar 18 #Javascript
jQuery each()方法的使用方法
Mar 18 #Javascript
jQuery each()小议
Mar 18 #Javascript
jquery ajax执行后台方法
Mar 18 #Javascript
jQuery中与toggleClass等价的程序段 以及未来学习的方向
Mar 18 #Javascript
javascript 验证日期的函数
Mar 18 #Javascript
12个非常有创意的JavaScript小游戏
Mar 18 #Javascript
You might like
深入php socket的讲解与实例分析
2013/06/13 PHP
ioncube_loader_win_5.2.dll的错误解决方法
2015/01/04 PHP
PHP邮箱验证示例教程
2016/06/01 PHP
JavaScript 拖拉缩放效果
2008/12/10 Javascript
基于jquery的lazy loader插件实现图片的延迟加载[简单使用]
2011/05/07 Javascript
jquery实现table鼠标经过变色代码
2013/09/25 Javascript
EasyUI中combobox默认值注意事项
2015/03/01 Javascript
深入理解JavaScript系列(46):代码复用模式(推荐篇)详解
2015/03/04 Javascript
JavaScript中逗号运算符介绍及使用示例
2015/03/13 Javascript
jquery实现仿JqueryUi可拖动的DIV实例
2015/07/31 Javascript
JavaScript 网页中实现一个计算当年还剩多少时间的倒数计时程序
2017/01/25 Javascript
bootstrap-table实现服务器分页的示例 (spring 后台)
2017/09/01 Javascript
vue 使用eventBus实现同级组件的通讯
2018/03/02 Javascript
代码实例ajax实现点击加载更多数据图片
2018/10/12 Javascript
详解微信小程序实现仿微信聊天界面(各种细节处理)
2019/02/17 Javascript
详解Jest结合Vue-test-utils使用的初步实践
2019/06/27 Javascript
vue 使用localstorage实现面包屑的操作
2020/11/16 Javascript
[55:35]VGJ.S vs Mski Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
星球大战与Python之间的那些事
2016/01/07 Python
初学python的操作难点总结(新手必看篇)
2017/08/03 Python
Python logging模块用法示例
2018/08/28 Python
对python中类的继承与方法重写介绍
2019/01/20 Python
Python爬虫学习之翻译小程序
2019/07/30 Python
python接口调用已训练好的caffe模型测试分类方法
2019/08/26 Python
使用apiDoc实现python接口文档编写
2019/11/19 Python
tensorflow模型保存、加载之变量重命名实例
2020/01/21 Python
动态设置django的model field的默认值操作步骤
2020/03/30 Python
用gpu训练好的神经网络,用tensorflow-cpu跑出错的原因及解决方案
2021/03/03 Python
大学生活学习的自我评价
2013/12/03 职场文书
文秘个人求职信范文
2014/04/22 职场文书
党员创先争优心得体会
2014/09/11 职场文书
收款授权委托书
2014/10/02 职场文书
一个成功的互联网创业项目,必须满足这些要求
2019/08/23 职场文书
Python 制作自动化翻译工具
2021/04/25 Python
Python编解码问题及文本文件处理方法详解
2021/06/20 Python
vue postcss-px2rem 自适应布局
2022/05/15 Vue.js