Java上的touch_移动端事件(touchstart+touchmove+touchend)

移动端事件有哪些:

触摸事件

手势事件

传感器事件

(后面两个兼容性不怎么样,因此重点就是触摸事件)

触摸事件:

touch 事件

pointer 事件

(PC端可能会使用jQuery做动画,移动端一般不会,基本都是使用css3做动画)

ontouchstart (必须在元素内部才能触发)

ontouchmove (元素内外都能触发)

ontouchend (元素内外都能触发)

ontouchcancel 触摸中断,多用于系统级处理,比如在触摸时突然接了个电话(一般几乎是用不上的)

推荐使用 addEventListener 来绑定事件,除非因为兼容性原因使用 on

touch

width:200px;

height:200px;

background:pink;

margin:20px auto;

}

var box=document.getElementById("box");//box.ontouchstart=handleStart;

//box.ontouchmove=handleMove;

//box.ontouchend=handleEnd;

box.addEventListener("touchstart",handleStart,false);

box.addEventListener("touchmove",handleMove,false);

box.addEventListener("touchend",handleEnd,false);functionhandleStart(){

console.log("touchstart");

}functionhandleMove(){

console.log("touchmove");

}functionhandleEnd(){

console.log("touchend");

}

3a80df5addafc835f913e4d9824f864a.png

touch事件的event对象

比较重要的属性

type: "touchstart"  触发的事件

target: div#box.box 触摸的元素

changedTouches: TouchList {0: Touch, length: 1}  发生变化的触摸点

targetTouches: TouchList  目标元素上的触摸点

touches: TouchList {0: Touch, length: 1}  所有触摸点

touch

}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值