为了让页面滚动的效果如丝般顺滑,从 chrome56 开始,在 window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数,会默认为是 passive: true。浏览器忽略 preventDefault()。

如果在以上这 3 个元素的 touchstart 和 touchmove 事件处理函数中调用 e.preventDefault() ,会被浏览器忽略掉,并不会阻止默认行为。

那么如何解决这个问题呢?不让控制台提示,而且 preventDefault() 有效果呢?
两个方案:
1、注册处理函数时,用如下方式,明确声明为不是被动的
window.addEventListener('touchmove', func, { passive: false })

2、应用 CSS 属性 touch-action: none; 这样任何触摸事件都不会产生默认行为,但是 touch 事件照样触发。

 

passive event 解决方法的更多相关文章

  1. 兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法

    兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法 // 获取事件function getEvent(){ if(window.event) {return w ...

  2. Firefox不支持event解决方法

    IE 中可以直接使用event 对象,而FF 中则不可以,解决方法之一如下: var theEvent = window.event || arguments.callee.caller.argume ...

  3. 滑动报 Unable to preventDefault inside passive event listener due to target being treated as passive 的解决方法

    google浏览器滑动出现以下问题: 解决办法如下:在html元素下添加样式 touch-action: none; html{ touch-action:none; }

  4. 浏览器兼容问题----Firefox不兼容event的解决方法

    一.event.srcElement:当前事件的源: 在IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcE ...

  5. Windows 7 SP1和Windows Server 2008 SP1的Event ID 10错误的解决方法

    安装了Windows 7 Service Pack 1 (SP1) 或 Windows Server 2008 R2 Service Pack 1 (SP1)都会遇到此错误提示. "Even ...

  6. 引用fastclick.js或使用触屏监听 滑动屏幕报错:解决[Intervention] Unable to preventDefault inside passive event listener

    使用fastClick.js所产生的一些问题 开发h5活动页时想到移动端会有300ms的延迟,于是便打算用fastClick.js解决. 页面引入fastClick.js后,滑动H5页面的时候发现谷歌 ...

  7. throw er; Unhandled 'error' event Error: listen EADDRINUSE的解决方法

    先把错误贴出来,如下: 出现此问题的原因是端口被占用,解决方法如下: 查看程序执行用到的端口的运行情况,本例是端口号3000; 占用该端口3000的进程是node,pid为244156,用kill命令 ...

  8. 滑动时候警告:Unable to preventDefault inside passive event listener

    1 前言 在制作2048时,需要在手机端添加滑动检测事件,然后发现控制台有警告,如下: main2048.js:218 [Intervention] Unable to preventDefault ...

  9. 移动端页面滑动时候警告:Unable to preventDefault inside passive event listener due to target being treated as passive.

    移动端项目中,在滚动的时候,会报出以下提示: [Intervention] Unable to preventDefault inside passive event listener due to ...

随机推荐

  1. 如何找出nginx配置文件的所在位置?

    对于一台陌生的服务器或安装太久忘了位置,怎么才能简单快速的找到配置文件的位置呢?要找出配置文件的位置,需要先找出nginx可执行文件的路径 , 这里有几种方法: 1.如果程序在运行中 ps -ef | ...

  2. fetch请求数据,后台将cookie一起返回时

    请求时,添加以上标记的属性,就可以拿到后台给的cookie,并返回给后台.比如登录后才能有的操作,这样就需要返回给后台cookie从而判断是否登录

  3. web项目数据存入mysql数据库中文乱码问题

    刚开始怀疑是项目中编码设置问题,发现在web.xml中已经有过设置:后来dubug显示数据在传输的过程中一切正常,怀疑是数据库编码问题,然后查看mysql编码: show variables like ...

  4. Codeforces 1142C(转化、凸包)

    可以变换坐标:x' = x, y' = y - x ^ 2,如此之后可得线性函数x' * b + c = y',可以发现两点连边为抛物线,而其他点都在这条线下方才满足题意,故而求一个上凸壳即可. #i ...

  5. Technocup 2017 - Elimination Round 1 (Unofficially Open for Everyone, Rated for Div. 2) A

    Vasily has a number a, which he wants to turn into a number b. For this purpose, he can do two types ...

  6. python入门之冒泡排序

    原理: (白话描述)一列数,从左到右,依次两两比较,若左边的数大于右边的数,则两数交换,始终保持比较后左边的数小于右边的数,这样从第一个到最后一个数全部比较一次就会把这列数中的最大值排到最后(最右边) ...

  7. [已读]JavaScript高级程序设计(第3版)

    从去年开始看,因为太长,总是没有办法一口气把它看完,再加上它与第二版大部分一致,读起来兴致会更缺一点. 与第二版相比,它最大的改变就是增加了很多html5的内容,譬如:Object对象的一些新东西,数 ...

  8. Spring Cloud Config git版

    由于在学习这块内容的时候还不会使用gitHub所以就用了osc的码云 config server POM文件 <dependency> <groupId>org.springf ...

  9. debian中sudo无法使用问题

    原文链接:http://sharadchhetri.com/2013/08/07/sudo-command-not-found-debian-7/ To solve this issue instal ...

  10. 什么是OOA/OOD

    Object Oriented Analyzing Object Oriented Design Object Oriented Programming ooa(object oriented ana ...