HTML5 移动端 自定义点击事件
/* 封装的TAP事件 */
(function () {
/**
* IOS 和 PC 端 只需要创建一次就能一直使用
* Android 手机 每次使用的时候都需要从新创建
*/
function createEvent() {
var myEvent = document.createEvent("HTMLEvents");
myEvent.initEvent("tap", true, true);
return myEvent;
}
var oldTime = null, newTime = null;
var startx, starty, endx, endy;
document.addEventListener("touchstart", function (ev) {
ev = ev || event;
oldTime = new Date().getTime();
startx = ev.changedTouches[0].clientX;
starty = ev.changedTouches[0].clientY;
});
document.addEventListener("touchend", function (ev) {
ev = ev || event;
newTime = new Date().getTime();
endx = ev.changedTouches[0].clientX;
endy = ev.changedTouches[0].clientY;
if(newTime - oldTime > 300) return;
if(Math.abs(startx - endx) > 10 || (Math.abs(starty - endy)) > 10) return;
ev.target.dispatchEvent(createEvent());
});
})();
HTML5 移动端 自定义点击事件的更多相关文章
- angularJS在移动端的点击事件延迟问题
在运用angular开发移动端的应用时,发现它并没有将ng-click做兼容,在移动端使用ng-click事件仍然会有300ms延迟.后来发现angular有一个专门针对移动端的模块:angular- ...
- jquery关于移动端的点击事件解析
jquery关于移动端的点击事件解析 如果用click来写 你连续点几下 会没有反应 响应是非常慢的 所以移动端必须用touchstart代替click来写
- 【技术博客】移动端的点击事件与Sticky Hover问题
目录 移动端的点击事件与Sticky Hover问题 TL;DR 前言 问题描述 背景 实现方式 问题 关于移动端浏览器的点击事件 初次发现问题后各种解决尝试:从点击事件本身下手 cursor: po ...
- ios移动端浏览器点击事件失效的解决方案
点击事件失效的原因可能是因为,你用了事件代理了, 比如这样 $(document).on("click",".fd",function(){ }) 这段代码在安 ...
- Android 自定义View——自定义点击事件
每个人手机上都有通讯录,这是毫无疑问的,我们通讯录上有一个控件,在通讯录的最左边有一列从”#”到”Z”的字母,我们通过滑动或点击指定的字母来确定联系人的位置,进而找到联系人.我们这一节就通过开发这个控 ...
- router-link 自定义点击事件
<li v-for="(item, index) in menuList"> <router-link class="classify" ta ...
- Android——自定义多击事件
一:使用场景 Android本身内置了点击.双击事件,但是某些时候,我们可能需要多击事件. 例如:某个秘密入口,为了避免用户误操作点击.双击到了触发开关而进入到不该被用户看到的页面,我们可以为入口控件 ...
- 移动端300ms点击事件的延迟
移动端click事件300ms延迟 移动端click事件300ms的延迟在目前看来,已经是老生常谈了. 以下内容,我会在参考资源的基础上谈谈我对移动端click事件300ms延迟的一些理解.本人愚昧, ...
- 移动端—— 兼容PC端,移动端的点击事件
移动设备上不支持鼠标事件,好在webkit内核的移动浏览器支持 touch 事件,所以触摸事件是移动应用中所必须的.touchstart.touchmove.touchend事件可以类比于moused ...
随机推荐
- Tempter of the Bone dfs+剪枝
The doggie found a bone in an ancient maze, which fascinated him a lot. However, when he picked it u ...
- 最短路--spfa+队列优化模板
spfa普通版就不写了,优化还是要的昂,spfa是可以判负环,接受负权边和重边的,判断负环只需要另开一个数组记录每个结点的入队次数,当有任意一个结点入队大于点数就表明有负环存在 #include< ...
- Maven Dependency错误——下载失败问题解决方案
问题描述: The container 'Maven Dependencies' references non existing library '${groupid}/${artifactid}-$ ...
- 【maven】使用import scope解决maven继承(单)问题
测试环境 maven 3.3.9 想必大家在做SpringBoot应用的时候,都会有如下代码: <parent> <groupId>org.springframework.bo ...
- 使用blessed 开发丰富的cli 应用
blessed 是一个不错的npm 包,可以帮助我们开发出带有丰富ui界面的cli 应用,类似的有subzero 测试环境准备 项目结构 ├── README.md ├── app.js ├── my ...
- FP-growth算法发现频繁项集(二)——发现频繁项集
上篇介绍了如何构建FP树,FP树的每条路径都满足最小支持度,我们需要做的是在一条路径上寻找到更多的关联关系. 抽取条件模式基 首先从FP树头指针表中的单个频繁元素项开始.对于每一个元素项,获得其对应的 ...
- mysql ssh 端口转发
某些时候 mysql 只允许 指定的 ip连接 .这时候怎么在本机 连接mysql 的呢? 条件 1 mysql 只有 允许 指定ip连接 2 有连接 指定 ip 服务器的 账密 这时候我们可以通 ...
- MyBatis持久层框架使用总结 转载
MyBatis持久层框架使用总结 MyBatis 本是apache的一个开源项目iBatis, 2010年这个项目由apache software foundation 迁移到了google co ...
- opencv中的图像形态学——腐蚀膨胀
腐蚀膨胀是图像形态学比较常见的处理,腐蚀一般可以用来消除噪点,分割出独立的图像元素等. 一般腐蚀操作对二值图进行处理,腐蚀操作如下图,中心位置的像素点是否与周围领域的像素点颜色一样(即是否是白色点,即 ...
- WPF Demo1
<Window x:Class="Demo1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/ ...