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 ...
随机推荐
- laravel中引入composer安装在vendor中的第三方组件
一.安装第三方组件 方法一:使用命令行安装第三方(已phpword为例): composer require phpoffce/phpword ^v0..* 方法二: 修改主项目composer.js ...
- 如何在SAP Kyma的控制台里扩展新的UI
方法是创建一个新的resource,类型为ClusterMicroFrontend. 使用命令行kubectl get ClusterMicroFrontend查看这些UI扩展: 最后自定义的UI出现 ...
- XML文件解析之DOM4J解析
1.DOM4J介绍 dom4j的官网是http://www.dom4j.org/dom4j-1.6.1/,最新的版本是1.6.1,根据官网介绍可知.dom4j是一个易用的.开源的库,应用于Java平台 ...
- BufferInputStream、BufferOutputStream、BufferedReader、BufferedWriter、Java代码使用BufferedReader和BufferedWriter实现文本文件的拷贝
BufferInputStream和BufferOutputStream的特点: 缓冲字节输入输出流,缓冲流是处理流,它不直接连接数据源/目的地,而是以一个字节流为参数,在节点流的基础上提供一些简单操 ...
- js form表单提交后如何可以不刷新页面 的解决办法
表单可实现无刷新页面提交,无需页面跳转,如下: 通过一个隐藏的iframe实现, form表单的target设置为iframe的name名称,form提交目标位当前页面iframe则不会刷新页面 &l ...
- windows使用msi包安装mysql8.0.12
1.前言 利用windows提供的二进制分发包(msi)安装是非常简单的,只要根据提示安装就可以了,和安装普通软件没有什么区别.但是如果想在安装的时候就把规划的配置好,是需要看懂每个步骤到底做什么用, ...
- Image Processing and Analysis_15_Image Registration:a survey of image registration techniques——1992
此主要讨论图像处理与分析.虽然计算机视觉部分的有些内容比如特 征提取等也可以归结到图像分析中来,但鉴于它们与计算机视觉的紧密联系,以 及它们的出处,没有把它们纳入到图像处理与分析中来.同样,这里面也有 ...
- WdatePicker日期控件使用与值获取,以及选择日期完毕触发事件
踩过无数坑,调试了很长时间,写出适合自己需求的方法需求:没有查询按钮,要求选择日期后自动触发查询事件(只有日期选择完成后才触发), 解决方案:代码如下:检索开始时间: <input type=& ...
- codeblocks glfw glew glm 配置
Code in code::blocks Download Mini project in c,c++,c# ,OpenGL,GLUT,GLFW,windows form application so ...
- Jmeter练习
首页 新随笔 管理 Jmeter接口测试实例-牛刀小试 本次测试的是基于HTTP协议的接口,主要是通过Jmeter来完成接口测试,借此熟悉Jmeter的基本操作. 本次实战,我是从网上找的接口 ...