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. java 数据结构(十二):Collections工具类的使用

    Collections工具类1.作用:操作Collection和Map的工具类 2.常用方法:reverse(List):反转 List 中元素的顺序shuffle(List):对 List 集合元素 ...

  2. JavaScript之setinterval的具体使用

    关于setInterval在api文档中也有很详细的解释,比如下面那两个: setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式. setInterval() 方法会不停 ...

  3. day5:isinstance&代码块&分支&while循环

    1.判断类型 isinstance语法:用法一: isinstance(要判断的值,要判断的类型) 返回True 或者 False用法二: isinstance(要判断的值,(可能的类型1,可能的类型 ...

  4. 二、Python系列——time时间格式的转换及计算

    # -*- coding:utf-8 -*- import pandas as pd import time import datetime start_date = '2020-06-08' # 一 ...

  5. linux目录结构 主流Linux发行版的目录结构

    目录 目录结构 一般教学的目录 CentOS7 openSUSE15.1 Ubuntu18.04 详细说明: /dev目录 /etc目录 /proc目录 /usr目录 /var目录 比较重要的目录 文 ...

  6. nginx: command not found

    nginx 正常启动,可以访问服务器地址:welcome to nginx 使用nginx -t 等命令时 报错:nginx: command not found 这是环境变量未配置 配置环境变量 v ...

  7. OSCP Learning Notes - Capstone(1)

    Kioptrix Level 1.1 Walkthrough Preparation: Download the virtual machine  from the following website ...

  8. Spring中与bean有关的生命周期

    前言 记得以前的时候,每次提起Spring中的bean相关的生命周期时,内心都无比的恐惧,因为好像有很多,自己又理不清楚,然后看网上的帖子,好像都是那么一套,什么beanFactory啊,aware接 ...

  9. 一个简单的Android小实例分享,包含recycleView与recyclerView嵌套

    先上图: 1.首页 2.第二页 3.第三页 项目目录: 代码不多,本人太懒,就不贴了 项目地址:

  10. Django学习路36_函数参数 反向解析 修改404 页面

    在 templates 中创建对应文件名的 html 文件 (.html) 注: 开发者服务器发生变更是因为 python 代码发生变化 如果 html 文件发生变化,服务器不会进行重启 需要自己手动 ...