touchend事件的preventDefault阻止掉了click事件
<div id="box">box</div>
<script>
var isTouchDevice = function() {
return 'ontouchstart' in window
}()
var startEvt = isTouchDevice ? 'touchstart' : 'mousedown'
var moveEvt = isTouchDevice ? 'touchmove' : 'mousemove'
var endEvt = isTouchDevice ? 'touchend' : 'mouseup'
var box = document.querySelector('#box') function add(type) {
var div = document.createElement('div')
div.innerHTML = type
box.appendChild(div)
}
box.addEventListener(startEvt, function(event) {
add(startEvt)
})
box.addEventListener(moveEvt, function(event) {
add(moveEvt)
})
box.addEventListener(endEvt, function(event) {
//event.preventDefault()
add(endEvt)
})
box.addEventListener('click', function(event) {
add('click')
})
</script>
document.body的click事件无效
document.documentElement的click事件ok
touchend事件的preventDefault阻止掉了click事件的更多相关文章
- 如何用按钮的click事件去触发a标签的click事件
在jQquery中,可以用如下方式触发input.a标签的click事件: <input id="my_input" /> <a id="my_a&qu ...
- a标签包着img事件 ie下 a标签的click事件失效
整个大的背景框有个点击事件, 如果标签结构是(详细的css样式略) a{background:green;} <a href=""> <img src=" ...
- 移动端click事件延迟300ms的原因以及解决办法
这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...
- 移动端click事件延迟300ms的原因以及解决办法[转载]
原文:http://www.bubuko.com/infodetail-822565.html 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为 ...
- 移动端web,tap与click事件
一.tap与click的区别 两者都会在点击时系统自动触发,但是在手机WEB端,click会有 200~300 ms.延迟来自判断双击和长按,因为只有默认等待时间结束以确定没有后续动作发生时,才会触发 ...
- 移动端的传统click事件延迟和点透现象
一.场景描述: 1.A/B两个层上下z轴重叠. 2.上层的A点击后消失或移开.(这一点很重要) 3.B元素本身有默认click事件(如a标签) 或 B绑定了click事件. 在以上情况下,点击A/B重 ...
- javascript 阻止事件冒泡和阻止默认事件对比
公司项目有像上图中效果的功能需求这也是很常见功能很简单功能,通过一个小例子和大家聊聊js的事件冒泡和默认事件. 先说说一般的实现方式即使用阻止事件冒泡的方式去做,给input绑定一个click事件(并 ...
- 移动端click事件延迟300ms到底是怎么回事,该如何解决?
不管在移动端还是PC端,我们都需要处理用户点击,这个最常用的事件.但在touch端click事件响应速度会比较慢,在较老的手机设备上会更为明显(300ms的延迟). 问题由来 这要追溯至 2007 年 ...
- safari浏览器click事件要点击两次才有响应出现闪烁
闪烁问题 由于在iOS Safari上click事件存在300ms响应延时,所以为touch事件添加样式,会和click事件默认样式叠加而产生闪烁问题. 因为ios safari浏览器中对触摸事件的响 ...
随机推荐
- jQuery Validate 插件
>>>>>>>>>>>>>>>>>>>>>>>>> ...
- 程序员带你十天快速入门Python,玩转电脑软件开发(一)
关注今日头条-做全栈攻城狮,学代码也要读书,爱全栈,更爱生活.提供程序员技术及生活指导干货. 如果你真想学习,请评论学过的每篇文章,记录学习的痕迹. 请把所有教程文章中所提及的代码,最少敲写三遍,达到 ...
- 用Module元素实现SharePoint Webpart Page的自动生成
最近研发的项目中开发了很多的WebPart,每次部署这些WebPart到新环境中总是很麻烦,因为自己要新创建WebpartPage,同时还要把这些WebPart放到指定的WebPart页中去: 为了方 ...
- Call to undefined function curl_init()解决方法
今天在使用php中的 curl 扩展时 在开启
- TCP/IP 协议理解
TCP/IP 协议(Transmission Control Protocol / internet Protocol),因特网互联协议,又名网络通讯协议.通俗而言:TCP负责发现传输的问题,一有问题 ...
- [GDI+] C# ImageDown帮助类教程与源码下载 (转载)
点击下载 ImageDown.zip 1.下载图片到本地代码如下 /// <summary> /// 编 码 人:苏飞 /// 联系方式:361983679 /// 更新网站:[url=h ...
- Android 输入法键盘和activity页面遮挡问题解决
本文主要介绍Android中如何解决输入法键盘和activity页面遮挡的问题. 总结: 不希望遮挡设置activity属性android:windowSoftInputMode="adju ...
- Android Studio SDK Manager无法正常下载如何设置
博客分类: Linux 零散小知识 Android那点事 AndroidStudioSDKManager 一方面在/etc/hosts中设置: #Google主页 203.208.46.146 ww ...
- android studio或者IntelliJ代码样式的设置
使用过程中发现了一些与Eclipse不同的地方,在这里提供一些设置方法 1. Backspace会将开头的空格和换行符一并删除,如果要禁用 Settings -> Editor -> ...
- WCF 无法生成 client
在MVC中调用WCF 总是没有client 后来在网上查找原因,去掉Reuse type in referrenced assenbiles ,就可以生成代理代码.