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
stackoverflow上类似的问题:https://stackoverflow.com/questions/29018151/how-do-i-programmatically-create-a-touchevent-in-chrome-41/42447620
JS模拟Touch事件的更多相关文章
- js的touch事件的实际引用
一开始做前端页面的时候,接触的也是js,但是随后便被简单高效的jquery吸引过去,并一直使用至今. 而js,则被我主观的认为底层技术而抛弃. 直到这几天工作需要,研究移动端页面的触屏滑动事件,搜索j ...
- js的Touch事件
js的touch事件,一般用于移动端的触屏滑动$(function(){document.addEventListener("touchmove", _touch, false); ...
- JS的Touch事件们,触屏时的js事件
丫的,终于找到了JS在平板电脑上的事件!!! iphone.ipod Touch.ipad触屏时的js事件 1.Touch事件简介 pc上的web页面鼠标会产生onmousedown.on ...
- js模拟触发事件
html标签元素封装着实用的[事件],但在很多时候,需要[模拟触发事件],比如 [按钮单机事件] 可以实实在在点击按钮触发该事件,但体验而言,很多时候需要js逻辑处理让实现 触发事件的效果这时就用 ...
- zepto.js 处理Touch事件(实例)
处理Touch事件能让你了解到用户的每一根手指的位置,在touch事件触发的时候产生,可以通过touch event handler的event对象取到,如果基于zepto.js开发,一般是通过eve ...
- zepto.js 处理Touch事件
处 理Touch事件能让你了解到用户的每一根手指的位置,在touch事件触发的时候产生,可以通过touch event handler的event对象取到,如果基于zepto.js开发,一般是通过ev ...
- 初识 jquery.simulate.js 模拟键盘事件
用jquery 和 jquery.simulate.js 实现模拟键盘事件,点击上下左右div相当于点击键盘的上下左右键 <!DOCTYPE html> <html> < ...
- JS模拟键盘事件 -- 原理及小例子
提问: 键盘默认事件,比如tab切换,alt+f4关闭,ctrl+t新建等,如果不想通过键盘而是一些按钮点击来触发这些功能,该咋办呢? 例子: 先以tab为例上一个小例子: <!DOCTYPE ...
- js 用touch事件实现简单tap
function _tap(dom,callBack){ var startTime=0; var delayTime=200; var isMove=false; dom.addEventListe ...
随机推荐
- 图像处理库GPUImage简单使用
一.介绍 GPUImage是一个基于OpenGL ES 2.0的开源的图像处理库,作者是Brad Larson.GPUImage将OpenGL ES封装为简洁的Objective-C或Swift接口, ...
- css 布局方式
布局方式 1 布局:设置元素在网页中的排列方式及显示效果 2 分类: 1 标准流布局(文档流,普通流,静态流) 是默认的布局方式 特点:将元素按照书写顺序及元素类型,从上至下,从左至右排列 2 浮动布 ...
- window下redis的安装和使用
1.下载及安装redis 下载地址:https://github.com/dmajkic/redis/downloads 找到对应的版本下载安装 打开cmd窗口,用cd命令进入到安装redis的根目录 ...
- Grassfire算法- 运动规划(Motion planning)
Grassfire算法: 一.概念 这个算法是做图像处理的抽骨架处理,目的是求出图像的骨架,可以想象一片与物体形状相同的草,沿其外围各点同时点火.当火势向内蔓延,向前推进的火线相遇处各点的轨迹就是中 ...
- linux设置自动同步服务器时间
最近遇到一个问题,由于两台服务器时间的问题,经常导致用户登录由于时间差问题而报错,再三百度,最后整理了一下修改linux定时同步的操作(本方法适用于有自己时间服务器,没有的只限于借鉴) 首先确认,我们 ...
- php+redis一步一步测试秒杀
1.普通的秒杀查库减库存: <?php /** 100个用户同时访问100次会出现超卖 **/ //连接数据库 $dsn = "mysql:host=localhost;dbname= ...
- depth/stencil buffer的作用 ----------理解模板缓存 opengl
在D3D11中,有depth/stencil buffer,它们和framebuffer相对应,如下图所示,framebuffer中一个像素,有相对应的depth buffer和stencil buf ...
- 机器学习(十)—聚类算法(KNN、Kmeans、密度聚类、层次聚类)
聚类算法 任务:将数据集中的样本划分成若干个通常不相交的子集,对特征空间的一种划分. 性能度量:类内相似度高,类间相似度低.两大类:1.有参考标签,外部指标:2.无参照,内部指标. 距离计算:非负性, ...
- 【转】Elastic-Job
https://www.cnblogs.com/yushangzuiyue/p/9655847.html 什么是Elastic-Job Elastic-Job是当当网大牛基于Zookepper,Qua ...
- python3 基础三
一.if语句 if condition_1: statement_block_1 elif condition_2: statement_block_2 else: statement_block_3 ...