모바일 단말기의 터치 이벤트에 대한 자세한 설명

이 기사는 모바일 단말기의 터치 이벤트에 대한 자세한 설명을 제공합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

1.touchstart

손가락이 화면을 터치하면 트리거됨

dom.addEventListener('touchstart',function(e){});
startX=e.touches[0].clientX;

e 객체에 포함된 움직임이 반환됨 이벤트별 최종 속성: e对象包含的移动端特有的属性：
tarchTouches:目标元素的所有当前触摸
changedTouches:页面上最新更改的所有触摸
touches: 页面上所有的触摸

2.touchmove

手指在屏幕上滑动时连续触发

dom.addEventListener('touchmove',function(e){});

事件返回的e对象包含的移动端特有的属性：
tarchTouches:目标元素的所有当前触摸
changedTouches:页面上最新更改的所有触摸
touches: 页面上所有的触摸

3.touchend

当手指离开屏幕时触发

dom.addEventListener('touchend',funciton(e){});
//在touchend中，touches拿不到touch对象，
//因为触摸已经结束，changedTouches中拿到触摸对象
//console.log(e);
//endX=e.touches[0];  undefined 
endX=e.changedTouches[0].clientX;

事件返回的e tarchTouches: 대상 요소의 현재 모든 터치
selectedTouches: 페이지에서 최근에 변경된 모든 터치
touches: 페이지의 모든 터치
2 .touchmove

손가락이 화면에서 미끄러질 때 계속 트리거됨

rrreee

이벤트에서 반환된 e 개체에는 모바일- 특정 속성: #🎜🎜 # tarchTouches: 대상 요소에 대한 현재 모든 터치

selectedTouches: 페이지의 최신 변경 사항에 대한 모든 터치
touches: 페이지의 모든 터치

3.touchend
#🎜 🎜#손가락이 화면을 떠날 때 트리거됨
rrreee

이벤트에서 반환된 e 개체에는 모바일 관련 속성이 포함되어 있습니다. #🎜🎜 #changeTouches: 페이지에서 최근에 변경된 모든 터치

touchcancel: 시스템이 터치 추적을 중지하면 시작됩니다. (자주 사용되지 않음)

터치엔드 이벤트에서는 이벤트 알림이 기록됩니다.changeTouches
4. : 뷰포트에 있는 터치 대상의 X 좌표입니다.

clientY: 뷰포트에서 터치 대상의 Y 좌표입니다.

pageX: 페이지 내 터치 대상의 x 좌표입니다. pageY: 페이지에서 터치 대상의 y 좌표입니다. screenX: 화면 터치 대상의 x 좌표입니다.

screenY: 화면에서 터치 대상의 y 좌표입니다. #🎜🎜##🎜🎜#관련 권장 사항: #🎜🎜##🎜🎜##🎜🎜#javascript 모바일 개발의 터치 이벤트에 대한 자세한 설명_javascript 기술#🎜🎜##🎜🎜##🎜🎜##🎜🎜# # 🎜🎜#javascript 모바일 장치용 웹 개발에서 터치 이벤트 캡슐화의 예_javascript 기술#🎜🎜##🎜🎜#

위 내용은 모바일 단말기의 터치 이벤트에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!