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浏览器中对触摸事件的响 ...
随机推荐
- [Twisted] deferred
Twisted提供一个优雅的实现(Deferred)来管理回调函数. Deferred Object 的结构 Deferred Object包含两个回调函数列表.一个用来保存成功的回调函数,另一个用来 ...
- C# CRC校验的一点感悟
今天在鼓捣一个手持操作器的时候,遇到一点问题,记录一下今天的经验包 由于之前公司产品在校验时基本上都是和校验,今天在准备用C#模拟一个古董操作器的时候,却遇到一个问题,模拟器发出的数据,主板一律不回复 ...
- CSS3弹性盒模型flex box快速入门 2016.03.16
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...
- List集合的去除重复性练习
package com.java.b.listdmeo.www; import java.util.ArrayList;import java.util.Iterator; import com.ja ...
- 使用java.util.Timer来周期性的执行制定的任务
使用java.util.Timer来周期性的执行制定的任务 public class HandlerTest extends Activity { int[] images = new int[] { ...
- 实现基于Memcache存储的Session类
自主实现Session功能的类,基于文件方式存储Session数据,测试基本通过,还比较好玩,实际应用没有意义,只不过是学习Session是如何实现的. 使用基于文件的Session存取瓶颈可能都是在 ...
- linux vim 基本操作
(一定要在英文输入法的状态下才有效)vi:实际上linux 上的 vi 不是真正的 vi,而是 vim;纯的 vi只在某些 unix 系统上还存在纯 的vi里面不支持退格键盘了,当按退格键盘以后,不是 ...
- ListView复用和优化详解
我们每一个Android开发人员对ListView的使用肯定是很熟悉的,然而多少人能真正的懂ListView的缓存机制呢,说白了就是ListView为了提高效率,而内部实现的一种优化,牺牲一点内存.而 ...
- php练习——打印半金字塔、金字塔、空心金字塔、菱形、空心菱形
半金字塔 金字塔 空心金字塔 菱形 空心菱形
- DAC,MAC和SELinux,SEAndroid
1. 被ROOT了怎么办 2. SELinux 3. SEAndroid 4. JB(4.3) MR2的漏洞弥补 ------------------------------------------- ...