A detailed description of the touch event on the mobile side

This article brings you the content of the mobile side of the touch event, there is a certain reference value, the need for friends can refer to, I hope to help you.

1.touchstart

Triggers when the finger touches the screen

Dom.addeventlistener (' Touchstart ', function (e) {}); startx=e.touches[0].clientx;

The object returned by the event e contains properties specific to the mobile side:
Tarchtouches: All current touches of the target element
Changedtouches: All touch of the latest change on the page
Touches: All the touches on the page

2.touchmove

Continuous trigger when finger is sliding on screen

Dom.addeventlistener (' Touchmove ', function (e) {});

The object returned by the event e contains properties specific to the mobile side:
Tarchtouches: All current touches of the target element
Changedtouches: All touch of the latest change on the page
Touches: All the touches on the page

3.touchend

Triggered when the finger leaves the screen

Dom.addeventlistener (' Touchend ', Funciton (e) {});//In Touchend, touches can't get touch object,//Because touch is over, Changedtouches gets touch object Console.log (e);//endx=e.touches[0];  Undefined endx=e.changedtouches[0].clientx;

The object returned by the event e contains properties specific to the mobile side:
Changedtouches: All touch of the latest change on the page
Touchcancel: Triggered when the system stops tracking touch. (not used frequently)
In the event of Touchend, events will be recorded Changetouches

4. E.touches[0]

ClientX: Touch the x-coordinate of the target in the viewport.
ClientY: Touch the y-coordinate of the target in the viewport.
PageX: Touch the x-coordinate of the target in the page.
Pagey: Touch the y-coordinate of the target in the page.
ScreenX: Touch the x-coordinate of the target in the screen.
ScreenY: Touch the y-coordinate of the target in the screen.