click延迟解决方案

    移动端click事件会有300ms的延迟,原因是移动端屏幕双击会缩放页面
1、禁止缩放功能 浏览器禁用默认双击缩放行为去掉300ms的点击延迟 user-scalable=no
2、利用touch事件自己封装这个事件解决300ms

3、使用fastclick插件

    先引用fastclick.js文件
    然后添加
    if ('addEventListener' in document) {
    document.addEventListener('DOMContentLoaded', function () {
    FastClick.attach(document.body);
    }, false);
    }
    这样页面中使用的点击事件全部取消了延迟时间
 <script src='./fastclick.js'></script>
     if ('addEventListener' in document) {
document.addEventListener('DOMContentLoaded', function () {
FastClick.attach(document.body);
}, false);
}
var goback = document.querySelector('.goback')
goback.addEventListener('click', function () {
alert('ok')
})

JS click延迟解决方案的更多相关文章

  1. JS页面延迟执行一些方法(整理)

    一般在JS页面延迟执行一些方法.可以使用以下的方法 jQuery.delay()方法简介 http://shawphy.com/2010/11/jquery-delay.html jQuery中que ...

  2. MySql从服务器延迟解决方案

    在从服务器上执行show slave status;可以查看到很多同步的参数,我们需要特别注意的参数如下:Master_Log_File:                      SLAVE中的I/ ...

  3. jquery.validate.js校验select2解决方案,Jquery插件select2校验解决方案

    jquery.validate.js校验select2解决方案 Jquery插件select2校验解决方案 >>>>>>>>>>>&g ...

  4. 聊聊click延迟和点击穿透

    博客原文地址:Claiyre的个人博客 https://claiyre.github.io/ 如需转载,请在文章开头注明原文地址 移动端click事件被延迟 移动端的开发经常需要监听用户的双击行为,所 ...

  5. js & click copy to clipboard

    js & click copy to clipboard https://www.cnblogs.com/xgqfrms/p/9999061.html https://www.cnblogs. ...

  6. node.js异步编程解决方案之Promise用法

    node.js异步编程解决方案之Promise var dbBase = require('../db/db_base'); var school_info_db = require('../db/s ...

  7. Atitit.js跨域解决方案attilax大总结 后台java php c#.net的CORS支持

    Atitit.js跨域解决方案attilax大总结 后台java php c#.net的CORS支持 1. 设置 document.domain为一致  推荐1 2. Apache 反向代理 推荐1 ...

  8. javascript js 完美解决 click 与 dblclick 冲突,并且不会导致click延迟

    示例代码: marker.addEventListener("click", function(){ if (!window.markerClicked) { window.mar ...

  9. AlloyTouch Button插件-不再愁click延迟和点击态

    移动端不能使用click,因为click会有300ms.所有有了fastclick这样的解决方案.然后fastclick并没有解决点击态(用户点击的瞬间要有及时的外观变化反馈)的问题.hover会有不 ...

随机推荐

  1. Python基础-类与对象

    类的基本使用 class Person(): def __init__(self,name,age): self.name = name self.age = age def info(self): ...

  2. 将ipynb文件转换为markdown

    jupyter nbconvert --to markdown "3.11-matplotlib 基础.ipynb"

  3. 如果你每次面试前都要去背一篇Spring中Bean的生命周期,请看完这篇文章

    前言 当你准备去复习Spring中Bean的生命周期的时候,这个时候你开始上网找资料,很大概率会看到下面这张图: 先不论这张图上是否全面,但是就说这张图吧,你是不是背了又忘,忘了又背? 究其原因在于, ...

  4. CCNA - Part7:网络层 - ICMP 应该是你最熟悉的协议了

    ICMP 协议 在之前网络层的介绍中,我们知道 IP 提供一种无连接的.尽力而为的服务.这就意味着无法进行流量控制与差错控制.因此在 IP 数据报的传输过程中,出现各种的错误是在所难免的,为了通知源主 ...

  5. Ethical Hacking - GAINING ACCESS(8)

    Server Side Attacks NeXpose - configure and launch a scan Configure and initialize the application. ...

  6. 集训作业 洛谷P1100 高低位交换

    这个题简单来说就是把一个数转成32位的2进制数,不够的补0.然后把这个数的前半部分和后半部分互换,再计算结果. 思路简单明了,接下来是代码: #include<iostream> #inc ...

  7. Nginx使用SSL模块配置https

    背景 开发微信小程序,需要https域名,因此使用Nginx的SSL模块配置https 步骤 一.去域名管理商(如腾讯云.阿里云等)申请CA证书 二.在Nginx中配置,一般情况下域名管理商会提供配置 ...

  8. maven项目原型(idea)

    1: internal -> appfuse-basic-jsf (创建一个基于Hibernate,Spring和JSF的Web应用程序的原型) 2: internal -> appfus ...

  9. springboot文件上传 流的方式 后台计算上传进度

    //代码 public static void main(String[] args) throws Exception { String path = "f:/svn/t_dictiona ...

  10. HTTP的实体数据

      数据类型表示实体数据的内容是什么,使用的是MIME    type,相关的头字段是Accept和Content-Type:  text:即文本格式的可读数据,我们最熟悉的应该就是text/html ...