js怎么使用touchmove事件?

JavaScript022

js怎么使用touchmove事件?,第1张

随着触屏手机、平板电脑的普及和占有更多用户和使用时间,触屏的触碰、滑动等事件也成为javaScript开发不可避免的知识,现在何问起就和大家一起学习js的触屏操作,js的触屏touchmove事件,为手指在屏幕上滑动触发的事件,这里制作了一个简单的示例,可以通过这个示例认识touchmove事件。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

//禁用手机默认的触屏滚动行为

document.addEventListener('touchmove', function(event) {

event.preventDefault()

}, false)

//touchstart事件

function touchSatrtFunc(evt) {

try {

//evt.preventDefault()//阻止触摸时浏览器的缩放、滚动条滚动等

var touch = evt.touches[0]//获取第一个触点

var x = Number(touch.pageX)//页面触点X坐标

var y = Number(touch.pageY)//页面触点Y坐标

//记录触点初始位置

startX = x

startY = y

} catch (e) {

alert('touchSatrtFunc:' + e.message)

}

}

//touchmove事件,这个事件无法获取坐标

function touchMoveFunc(evt) {

try {

//evt.preventDefault()//阻止触摸时浏览器的缩放、滚动条滚动等

var touch = evt.touches[0]//获取第一个触点

var x = Number(touch.pageX)//页面触点X坐标