jQuery通过event获取点击事件的事件对象
要想搞明白js的事件机制,必须搞清楚几个概念:事件对象,事件源,还有事件流
事件对象:
当事件发生时会产生事件对象,事件对象的作用是用来记录“事件发生是一些相关的信息。注意事件对象只有在事件发生时才会产生,我们无法手动创建,并且事件对象只能在处理函数内部访问,处理函数允许结束后该对象自动销毁。
怎么理解那??
如上代码,当onmousemove事件发生时,就会产生一个事件对象,就是程序中的event对象,我们只能在这个匿名函数中访问到这个event对象,在函数外面是访问不到的,同样我们也无法手动创建这个event对象;
如何获取事件对象那??
var e = event || window.event; 这句话就是定义了一个变量来获取事件对象,因为不同的浏览器获取事件对象的方法有点不太一样,IE下是window.event,标准下是event,为 了兼容所以写了event || window.event.
事件对象也分为:
鼠标事件对象,键盘事件对象等,顾名思义鼠标事件发生时产生鼠标事件对象,键盘事件发生时产生键盘事件对象;既然是对象,就必然有一些属性方法啥的。
鼠标事件对象上的常用属性:
clientX,clientY,screenX,screenY,offsetX,offsetY
键盘事件对象上的属性有:
keyCode: 用来获取键盘码的;比如空格的键盘是32,回车13等
cltkey: 判断alt键是否被按下,按下是true,反之false
Ctrlkey: 判断Ctrlkey键是否被按下,按下是true,反之false
Shiftkey : 判断Shiftkey 键是否被按下,按下是true,反之false
说到这里相信大家应该理解“事件对象”了吧!接着说一说事件源。
事件源:
在事件中,当前操作的那个元素就是事件源。比如网页元素中a标签和input都有onclick事件,当点击a发生onclick事件时,事件源就是a标签,当点击input发送onclic事件是,事件源就是input。
如何获取事件源那??
IE下:window.event.srcElement
标准下:event.target
由此可见,我们是通过事件对象获取到的事件源。
例如:点击一个div外部的时候使div消失
$(document).click(function(event) {
if ($(event.target).attr("class") != "unitName") {
if ($("#showDiv").css("display") == "block") {
$("#showDiv").css("display", "none");// 点击外部的时候隐藏名字提示框
}
}
})
查看事件的target:

jQuery通过event获取点击事件的事件对象的更多相关文章
- jquery利用event.which方法获取键盘输入值的代码
jquery利用event.which方法获取键盘输入值的代码,需要的朋友可以参考下. 实例 显示按了哪个键: $("input").keydown(function(event) ...
- jQuery Mobile Slider 禁用点击事件
阿子原创,转载请注明出处. 在使用jQuery Mobile Slider时,发现在页面上下拖动时,很容易不小心触发Slider的点击事件,从而造成误操作.为此需要禁用Slider的点击事件. 官方A ...
- jQuery获取点击对象的父级
一.使用$('body').on('click','.index',function(event){})绑定事件时,例: <div class="project-box"&g ...
- 使用jQuery模拟鼠标点击a标签事件
来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <t ...
- jquery data方法获取某个元素上事件
获取某个元素上的事件,jquery的给元素绑定的事件可以用data方法取出来. 通过$(element).data("events")来获取 // 比如给一个button绑定两个c ...
- (转载)js(jquery)的on绑定点击事件执行两次的解决办法
js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...
- jquery 触发a链接点击事件
jquery 触发a链接点击事件 <p class="btnSubmit"><a href="javascript:submitData();" ...
- 使用JS或jQuery模拟鼠标点击a标签事件代码
原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...
- jQuery绑定和解绑点击事件及重复绑定解决办法
原文地址:http://www.111cn.net/wy/jquery/47597.htm 绑点击事件这个是jquery一个常用的功能,如click,unbind等等这些事件绑定事情,但还有很多朋友不 ...
随机推荐
- (进制)51NOD 1057 N的阶乘
输入N求N的阶乘的准确值. Input 输入N(1 <= N <= 10000) Output 输出N的阶乘 Input示例 5 Output示例 120解:这其实是MOD进制,将一个 ...
- array_column() 函数[二维数组转为一维数组]
array_column() 函数 输出数组中某个键值的集合[二维数组转为一位数组] <?php // 表示由数据库返回的可能记录集的数组 $a = array( array( 'id' =&g ...
- ACM_寒冰王座(完全背包)
寒冰王座 Time Limit: 2000/1000ms (Java/Others) Problem Description: 不死族的巫妖王发工资拉,死亡骑士拿到一张N元的钞票(记住,只有一张钞票) ...
- C# 相关概念
解决方案 在磁盘上由 .sln 文件表示,是一个或多个相关项目的容器. 例如,如果为 Python 应用程序编写 C++ 扩展,该 C++ 项目可以驻留在同一解决方案中. 解决方案还可以包含 Web ...
- [ CodeForces 1063 A ] Oh Those Palindromes
\(\\\) \(Description\) 给出 \(N\) 个小写字母,将他们排成一个字符串,使得这个字符串里包含的回文串最多. \(N\le 10^5\) \(\\\) \(Solution\) ...
- JavaScript(十)基本包装类
基本包装类都具有对象的基本方法 toString 和 valueOf Number 数字是原始类型,那为啥还有方法? 因为他在执行方法的时候会创建一个对应的包装类对象,这个对象有这种方法, ...
- apache hadoop 伪分布式安装
1. 准备工作 1.1. 软件准备 1.安装VMWare 2.在VMWare上安装CentOS6.5 3.安装XShell5,用来远程登录系统 4.通过rpm -qa | grep ssh 检查cen ...
- vs2017 visual studio2017 密钥 激活码
企业版Enterprise: NJVYC-BMHX2-G77MM-4XJMR-6Q8QF 专业版Professional: KBJFW-NXHK6-W4WJM-CRMQB-G3CDH
- POJ_1847_Tram
Tram Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 11159 Accepted: 4089 Description ...
- CAD隐藏或显示工具条上的按钮(com接口VB语言)
主要用到函数说明: MxDrawXCustomFunction::Mx_HideToolBarControl 隐藏或显示工具条上的按钮.详细说明如下: 参数 说明 IN LPCTSTR pszTool ...