JS模拟Touch事件

时间:2023-03-09 18:38:28
JS模拟Touch事件
        var ele =  document.getElementsByClassName('target_node_class')[0]
//may have x and y properties in some browsers,But it always has left, top, right, and bottom properties.
var rect = ele.getBoundingClientRect();
var touch = new Touch({
"identifier" : 0,
"target" : ele,
"clientX" : (rect.left + rect.right)/2,
"clientY" : (rect.top + rect.bottom)/2,
"screenX" : (rect.left + rect.right)/2,
"screenY" : (rect.top + rect.bottom)/2,
"pageX" : (rect.left + rect.right)/2,
"pageY" : (rect.top + rect.bottom)/2,
"radiusX" : 11.5,
"radiusY" : 11.5,
"rotationAngle" : 0.0,
"force" : 1}); var touchstart = new TouchEvent("touchstart", {
cancelable: true,
bubbles: true,
composed: true,
touches: [touch],
targetTouches: [touch],
changedTouches: [touch]
}); var touchend = new TouchEvent("touchend", {
cancelable: true,
bubbles: true,
composed: true,
touches: [touch],
targetTouches: [touch],
changedTouches: [touch]
}); ele.dispatchEvent(touchstart);
ele.dispatchEvent(touchend);

相关WebAPI

Touch: https://developer.mozilla.org/en-US/docs/Web/API/Touch/Touch

TouchEvent: https://developer.mozilla.org/en-US/docs/Web/API/TouchEvent/TouchEvent

*上类似的问题:https://*.com/questions/29018151/how-do-i-programmatically-create-a-touchevent-in-chrome-41/42447620