- 加入我的QQ群
- 关注我的百家号
扫描下面的二维码,“关注”我的百家号。
前面我们介绍了jquery事件的绑定、jquery事件模拟以及jquery复合事件。而jquery事件发生时,都会产生一个事件对象。jquery事件对象代表事件状态,如:事件发生的元素,键盘状态,鼠标位置和鼠标按钮状态等等。下面一起来看看juqery事件对象都有哪些?
type: 获取事件的类型,如:click、mouseover等。
target: 获取绑定事件的 DOM 元素,如:div
relatedTarget: 获取移入移出目标点离开或进入的那个 DOM 元素
currentTarget: 获取冒泡前触发的 DOM 元素,等同与 this
data: 获取事件调用时的额外数据。
timeStamp: 获取事件触发的时间戳
result: 获取上一个相同事件的返回值
which: 获取鼠标的左中右键(1,2,3),或获取键盘按键
pageX/pageY: 获取相对于页面原点的水平/垂直坐标
screenX/screenY: 获取相对于显示器屏幕位置的水平/垂直坐标(非 jQuery 封装)
clientX/clientY: 获取相对于页面视窗的水平/垂直坐标(非 jQuery 封装)
altKey/shiftKey/ctrlKey: 获取是否按下了 alt、shift、ctrl(这三个非 jQuery 封装)
案例:
通过 event.type 属性获取触发事件名
$('input').click(function (e) {
alert(e.type);
});
通过event.data 获取额外数据,对于封装的简写事件也可以使用
$('input').click({user : 'Lee', age : 100},function (e) {
alert(e.data.user);
});
jquery事件对象是非常有用的,在我们实现际使用jquery代码实现一些事件效果时,我们会经常用到。如果感兴趣,你可以进一步深入了解。
timeStamp对象以前没有接触过,这次好好学习一下。