Touch對(duì)象表示在觸控設(shè)備上的觸摸點(diǎn)，通常是指手指在觸屏設(shè)備或者觸摸板上的操作门粪，在用戶手機(jī)在屏幕上滑動(dòng)時(shí)就會(huì)實(shí)時(shí)的觸發(fā)touch事件
touchstart
當(dāng)用戶手指放到屏幕上觸發(fā)touchmove
當(dāng)用戶手指在屏幕上移動(dòng)時(shí)觸發(fā)touchend
當(dāng)用戶手指從屏幕上離開時(shí)觸發(fā)
當(dāng)我們?cè)谝苿?dòng)端觸發(fā)觸屏事件時(shí)運(yùn)動(dòng)變量e會(huì)返回一個(gè)TouchEvent對(duì)象徙瓶，在該對(duì)象中包含幾個(gè)我們需要的關(guān)鍵信息
- touches:當(dāng)前屏幕上所有手指觸摸點(diǎn)的列表
- targetTouches：當(dāng)前對(duì)象上所有觸摸點(diǎn)的列表
- changedTouches：涉及引發(fā)當(dāng)前事件的所有觸摸點(diǎn)的列表
我們一般使用changeTouch來獲取當(dāng)前手指的相對(duì)位置
clientX:14.474000930786133
clientY:113.15800476074219
force:1
identifier:0
pageX:14.474000930786133
pageY:113.15800476074219
radiusX:15.131579399108887
radiusY:15.131579399108887
rotationAngle:0
screenX:181
screenY:244
target:li
在移動(dòng)端我們會(huì)使用touch事件來替代mouse事件毛雇，并且在移動(dòng)端的click事件有300ms的延遲，這有時(shí)可能會(huì)造成用戶感覺反應(yīng)遲緩侦镇，所有有時(shí)我們需要使用touch事件來替代click事件
var webClick = function (ele, callback) {
if (ele && typeof ele == 'object') {
var isMove = true,
startTime,
endTime;
ele.addEventListener("touchstart", function () {
startTime = Date.now()
})
ele.addEventListener("touchmove", function () {
isMove = true;
})
ele.addEventListener("touchend", function () {
endTime = Date.now();
if (!isMove && endTime - startTime < 150) {
callback && callback();
}
isMove = false;
})
}
}
同樣我們可以使用上面的代碼來監(jiān)聽用戶長按事件灵疮，只需要判斷用戶手指在屏幕的停留時(shí)間即可
