passive event 解决方法
为了让页面滚动的效果如丝般顺滑,从 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 解决方法的更多相关文章
- 兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法
兼容firefox,ie,谷歌,阻止浏览器冒泡事件,Firefox不支持event解决方法 // 获取事件function getEvent(){ if(window.event) {return w ...
- Firefox不支持event解决方法
IE 中可以直接使用event 对象,而FF 中则不可以,解决方法之一如下: var theEvent = window.event || arguments.callee.caller.argume ...
- 滑动报 Unable to preventDefault inside passive event listener due to target being treated as passive 的解决方法
google浏览器滑动出现以下问题: 解决办法如下:在html元素下添加样式 touch-action: none; html{ touch-action:none; }
- 浏览器兼容问题----Firefox不兼容event的解决方法
一.event.srcElement:当前事件的源: 在IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcE ...
- 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 ...
- 引用fastclick.js或使用触屏监听 滑动屏幕报错:解决[Intervention] Unable to preventDefault inside passive event listener
使用fastClick.js所产生的一些问题 开发h5活动页时想到移动端会有300ms的延迟,于是便打算用fastClick.js解决. 页面引入fastClick.js后,滑动H5页面的时候发现谷歌 ...
- throw er; Unhandled 'error' event Error: listen EADDRINUSE的解决方法
先把错误贴出来,如下: 出现此问题的原因是端口被占用,解决方法如下: 查看程序执行用到的端口的运行情况,本例是端口号3000; 占用该端口3000的进程是node,pid为244156,用kill命令 ...
- 滑动时候警告:Unable to preventDefault inside passive event listener
1 前言 在制作2048时,需要在手机端添加滑动检测事件,然后发现控制台有警告,如下: main2048.js:218 [Intervention] Unable to preventDefault ...
- 移动端页面滑动时候警告:Unable to preventDefault inside passive event listener due to target being treated as passive.
移动端项目中,在滚动的时候,会报出以下提示: [Intervention] Unable to preventDefault inside passive event listener due to ...
随机推荐
- css 的继承性
目录 css 的继承性是什么? 父元素的属性那些可以被子元素继承,哪些不能呢? css 的继承性是什么? 在面向对象语言都会存在继承的概念,在面向对象语言中,继承的特点:继承了父类的属性和方法. 那么 ...
- __str__,__repr__
目录 __str__ __repr__ __str__ 打印时触发 class Foo: pass obj = Foo() print(obj) <__main__.Foo object at ...
- assembly x86(nasm)画三角形等图形的实现
参考了一位大佬的博客 https://blog.csdn.net/qq_40298054/article/details/84496944传送门 https://blog.csdn.net/qq_40 ...
- MyBatist庖丁解牛(二)
站在巨人的肩膀上 https://blog.csdn.net/xiaokang123456kao/article/details/76228684 一.概述 我们知道,Mybatis实现增删改查需要进 ...
- extern使用方法总结!(转)
extern 在源文件A里定义的函数,在其它源文件里是看不见的(即不能访问).为了在源文件B里能调用这个函数,应该在B的头部加上一个外部声明: extern 函数原型: 这样,在源文件B里也可以调 ...
- TYVJ1424占卜DIY
Description lyd学会了使用扑克DIY占卜.方法如下:一副去掉大小王的扑克共52张,打乱后均分为13堆,编号1~13,每堆4张,其中第13堆称作“生命牌”,也就是说你有4条命.这里边,4张 ...
- 如何利用python制作微信好友头像照片墙?
这个不难,主要用到itchat和pillow这2个库,其中itchat用于获取微信好友头像照片,pillow用于拼接头像生成一个照片墙,下面我简单介绍一下实现过程,代码量不多,也很好理解,实验环境wi ...
- POJ-1020-Anniversary Cake
链接:https://vjudge.net/problem/POJ-1020 题意: 给一个宽为s的正方形,再给n个变长为an的小正方形, 判断是否能将这n个小正方形完全填充到这个大正方形里面. 思路 ...
- 17 文件和网络I/O
1 文件和网络I/O 1.1 文件处理 groovy向java所提供的File 类,新增了几个方便的方法.分别是:eachLine和.text. package file class F ...
- how browser handler file:/// link
1. why browser can only open .txt file directly, pop up open or save dialog for others? 2. html cann ...