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. 数据可视化基础专题(十):Matplotlib 基础(二) 自定义配置文件和绘图风格(rcParams和style)

    https://matplotlib.org/api/rcsetup_api.html#module-matplotlib.rcsetup 一.什么是rcParams?我们在使用matplotlibl ...

  2. 数据可视化之分析篇(三)Power BI总计行错误,这个技巧一定要掌握

    https://zhuanlan.zhihu.com/p/102567707 ​前一段介绍过一个客户购买频次统计的案例: Power BI 数据分析应用:客户购买频次分布. 我并没有在文章中显示总计行 ...

  3. 安装 VsCode 插件安装以及配置

    安装vscode 官方网站 https://code.visualstudio.com/ 下载后 1.双击vscode.exe 2.选择 我接受  3.一路下一步,遇到方框就选4.点击  安装按钮 v ...

  4. kafka 监控工具 eagle 的安装(内附高速下载地址)

    简介 如图 kafka eagle 是可视化的 kafka 监视系统,用于监控 kafka 集群 环境准备: 需要的内存:1.5G+ 支持的 kafka 版本:0.8.2.x,0.9.x,0.10.x ...

  5. 使用QtCreator遇到的一些问题

    0. 背景 最近在学习QtCreator(版本:4.8.1:编译器:MSVC 2017 64-bit),遇到了一些问题,特记录如下.( 1. 引用库 QtCreator可以直接包含Windows.h, ...

  6. 学会DevOps 能拿多少工资?DevOps 怎么自学?

    落地高薪!DevOps为何受宠? DevOps在近几年的发展势头可谓是迅猛无比,已经有越来越多的企业机构开始尝试落地,从国外的微软谷歌到国内的阿里腾讯,DevOps已经从时髦概念落地最佳实践,进而改变 ...

  7. 手动造轮子——为Ocelot集成Nacos注册中心

    前言     近期在看博客的时候或者在群里看聊天的时候,发现很多都提到了Ocelot网关的问题.我之前也研究过一点,网关本身是一种通用的解决方案,主要的工作就是拦截请求统一处理,比如认证.授权.熔断. ...

  8. 【Nginx】图片显示过慢,文件下载不完全,竟然是Nginx的锅!!

    写在前面 最近,一名读者跟我说他通过浏览器访问自己的服务器时,图片显示的非常慢,以至于在浏览器中都无法完全加载出来,下载文件时,更是恼火,文件根本就无法完全下载下来.而且奇怪的是这位读者所在的网络是没 ...

  9. js JQ动态添加div标签

    function renderList(data){ var str = ''; for(var i = 0; i < data.length; i++){ // 动态添加li str += ' ...

  10. Monster Audio 使用教程 (七) 防止声音过大,出现爆音

    有用户反映,如果音乐音量过大,会出现爆音. 这其实是音频信号过载了.只要最后输出的音量超过0db,就会出现爆音,这是数字音频都应该注意的问题. 所以,为了解决这个问题,限制器就出现了,它能把音频信号压 ...