时间:2021-05-26
事件对象是用来记录一些事件发生时的相关信息的对象。事件对象只有事件发生时才会产生,并且只能是事件处理函数内部访问,在所有事件处理函数运行结束后,事件对象就被销毁!
originalEvent对象
在一次偶然的使用中,我发现当使用on()函数并且传入第二个选择器参数时,e.touches[0]的访问为undefined,打印e发现,它的事件对象不是原生的事件对象。经查阅发现它是jquery事件对象。
$(window).on("touchstart","body",function(e){ console.log(e)})上面例子中event中有一个originalEvent属性,而这才是真正的touch事件。jQuery.Event 是一个构造函数,其创建一个可读写的jQuery事件对象,并在event 对象保留了对这个原生事件对象 event 的引用($event.originalEvent)。我们绑定的事件处理程序所处理的事件对象都是 $event。该方法也可以传递一个自定义事件的类型名,用于生成用户自定义事件对象。
touch事件
touchmove: 当手指在屏幕上滑动的时候连续地触发。
touchstart: 当手指触摸屏幕时候触发,即使已经有一个手指放在屏幕上也会触发
touchend: 当手指从屏幕上离开的时候触发。
TouchEvent对象
每一个touch事件的触发都会产生一个TouchEvent对象,以下是TouchEvent对象三个比较常用的重要属性
touches 当前位于屏幕上的所有手指的一个列表。
targetTouches 特定于事件目标的Touch对象的数组。[当前手指]
changeTouches 表示自上次触摸以来发生了什么改变的Touch对象的数组。
在这里,我用js写了一个touch事件,点击屏幕可触发,将其事件事件对象在控制台打印出,结果如下(箭头指向的是上述三个属性):
window.addEventListener("touchstart",function(event){ console.log(event);})触摸事件对象属性
touches、targetTou、changeTouches都包含以下属性值
clientX:触摸目标在视口中的x坐标。
clientY:触摸目标在视口中的y坐标。
identifier:标识触摸的唯一ID。
pageX:触摸目标在页面中的x坐标。
pageY:触摸目标在页面中的y坐标。
screenX:触摸目标在屏幕中的x坐标。
screenY:触摸目标在屏幕中的y坐标。
target:触摸的DOM节点目标。
还是上面的那个例子,changeTouches对象在控制台输出如下:
以上就是本文的全部内容,希望对大家的学习有所帮助。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
一、移动端触摸事件ontouchstart、ontouchmove、ontouchend、ontouchcancel1、Touch事件简介pc上的web页面鼠标
北京营销型网站建设公司分享jQuery表达的触摸事件,触摸(touch)事件会在用户触摸页面时发生,点击,点击不放(长按)及滑动等动作都会触发touch事件.当
android中的事件类型分为按键事件和屏幕触摸事件,Touch事件是屏幕触摸事件的基础事件,有必要对它进行深入的了解。一个最简单的屏幕触摸动作触发了一系列To
Touch.js手势库是专门在Webkit内核浏览器的移动设备中使用中设计的,Touch.js是移动设备上的手势识别与事件库。Touch.js基于原生事件,支持
Touch事件分发中只有两个主角:ViewGroup和View。Activity的Touch事件事实上是调用它内部的ViewGroup的Touch事件,可以直接