移动端的click事件延迟触发的原理是什么？如何解决这个问题？

  • 原理 ：移动端屏幕双击会缩放页面 300ms延迟
  • 会出现点透现象

    在列表页面上创建一个弹出层，弹出层有个关闭的按钮，你点了这个按钮关闭弹出层后后，因为有300ms延迟,所以这个按钮正下方的内容也会执行点击事件（或打开链接）。这个被定义为这是一个“点透”现象
  • 解决方案

    • 视口标签中禁止用户缩放

      <meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">

    • 利用touch事件封装事件解除300ms延迟

    • 使用插件 fastclick插件解决300ms延迟

      官网:https://github.com/ftlabs/fastclick lib文件----fastclick

移动端的click事件延迟触发的原理是什么？如何解决这个问题？的更多相关文章

  1. 解决在移动端上 click事件延迟300 毫秒的问题 fastclick.js

    1 为什么会发生延迟300毫秒的问题 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击.为了能够立即响应用户的点击事件,才有了FastClick ...

  2. 移动端click事件延迟300ms的原因以及解决办法

    这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...

  3. 移动端click事件延迟300ms的原因以及解决办法[转载]

    原文:http://www.bubuko.com/infodetail-822565.html 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为 ...

  4. 移动端的传统click事件延迟和点透现象

    一.场景描述: 1.A/B两个层上下z轴重叠. 2.上层的A点击后消失或移开.(这一点很重要) 3.B元素本身有默认click事件(如a标签) 或 B绑定了click事件. 在以上情况下,点击A/B重 ...

  5. 苹果浏览器移动端click事件延迟300ms的原因以及解决办法

    这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...

  6. 关于移动端的Click事件

    在移动端执行Click事件,通常情况出现有300毫秒的延迟,为防止这种不必要的延迟效果,我们可以换种方式来实现,同样达到快速执行Click事件的效果. 先了解一下移动端Click的执行顺序: touc ...

  7. 如何用按钮的click事件去触发a标签的click事件

    在jQquery中,可以用如下方式触发input.a标签的click事件: <input id="my_input" /> <a id="my_a&qu ...

  8. iphone上click事件不触发的问题解决。

    iphone上click事件不触发的问题解决. //在ID为jsProvince上有这么一个事件: $('body').on('click', '#jsProvince', function(e){ ...

  9. EasyUi中的datagird中a标签的click事件无法触发？（已解决）

    ***************************2015-10-29 21:07************************* 问题如下: datagrid最后一列编辑中有如下a标签 { f ...

随机推荐

  1. POJ_2115_扩展欧几里德

    C Looooops Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 23673   Accepted: 6540 Descr ...

  2. :before和:after结合使用

    <div class="slider-block" id="block" style="left: 15.5px;" data=&qu ...

  3. [adb]查看 App的appPackage和appActivity

    最近在写app的UI框架,写脚本之前需要知道app的包名和activity,如果获取呢: 需求配置abdrioid sdk环境 方法1:abd log 1. 打开cmd命令窗口2.在命令窗口中输入,a ...

  4. 洛谷P1583 魔法照片【模拟+排序】

    一共有n(n≤20000)个人(以1--n编号)向佳佳要照片,而佳佳只能把照片给其中的k个人.佳佳按照与他们的关系好坏的程度给每个人赋予了一个初始权值W[i].然后将初始权值从大到小进行排序,每人就有 ...

  5. nyoj24-素数 距离问题

    素数距离问题 时间限制:3000 ms  |  内存限制:65535 KB 难度:2 描述 现在给出你一些数,要求你写出一个程序,输出这些整数相邻最近的素数,并输出其相距长度.如果左右有等距离长度素数 ...

  6. Linux思维导图之rpm、yum、编译

    yum安装失败: 1.yum client 路径指向不正确:2.yum server 缓存未清理(yum clean all;yum makecache):3.网络不连通

  7. centos7下源码方式安装gitlab8.9+发送邮件+ldap

    CentOS7下源码方式安装gitlab 环境描述 操作系统: centos7 redis: >=2.8 mysql >=5.5.14 git >=2.7.4 架构设计 一台gitl ...

  8. 执行计划中Using filesort,Using temporary相关语句的优化解决

    昨天听开发人员提到,相关的彩票网页当中一个页面刷新的很慢,特别是在提取数据的时候,今天早上一到,便去找开发人员要去相关的也没进行浏览,窥探哪些数据出现了问题,开发人员使用PHP开发,所以我用IE很容易 ...

  9. Atomic operations on the x86 processors

    On the Intel type of x86 processors including AMD, increasingly there are more CPU cores or processo ...

  10. 解读grub.conf文件

    我们将来看看grub.conf文件内语句,(注:...)内的东西是我们的解读内容. # grub.conf generated by anaconda # # Note that you do not ...