我正在使用锤子进行拖动，并且在加载其他东西时它变得断断续续，因为这条警告消息告诉我。
由于主线程忙，“touchstart”输入事件的处理延迟了 X 毫秒。考虑将事件处理程序标记为“被动”以使页面更具响应性。
所以我试着像这样给听众添加“被动”
Hammer(element[0]).on("touchstart", function(ev) {
// stuff
}, {
passive: true
});
但我仍然收到此警告。
考虑将事件处理程序标记为“被动”以使页面更具响应性
IT技术
javascript
jquery
angularjs
touch
hammer.js
2021-02-03 04:44:58
6个回答
对于那些第一次收到此警告的人来说，这是由于最近（2016 年夏季）在浏览器中实现了一种称为被动事件侦听器的前沿功能。从https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md：
被动事件侦听器是 DOM 规范中的一项新功能，通过消除滚动阻止触摸和滚轮事件侦听器的需要，开发人员可以选择加入以获得更好的滚动性能。开发人员可以使用 {passive: true} 注释触摸和滚轮侦听器，以表明他们永远不会调用 preventDefault。此功能在 Chrome 51、Firefox 49 中提供，并在 WebKit 中登陆。有关完整的官方解释，请在此处阅读更多内容。
另请参阅：什么是被动事件侦听器？
您可能需要等待 .js 库实现支持。
如果您通过 JavaScript 库间接处理事件，您可能会受制于该特定库对该功能的支持。截至 2019 年 12 月，似乎没有任何主要图书馆实施支持。一些例子：
- jQuery.js - 持续问题：https : //github.com/jquery/jquery/issues/2871
- React.js - 持续问题：https : //github.com/facebook/react/issues/6436
- Hammer.js - 由于没有跟进而关闭：https : //github.com/hammerjs/hammer.js/pull/987
- 完美滚动条- 关闭：https : //github.com/noraesae/perfect-scrollbar/issues/560
- AngularJS - 由于无法修复而关闭：https : //github.com/angular/angular.js/issues/15901
这将隐藏警告消息：
jQuery.event.special.touchstart = {
setup: function( _, ns, handle ) {
this.addEventListener("touchstart", handle, { passive: !ns.includes("noPreventDefault") });
}
};
对于带有 jquery-ui-touch-punch 的 jquery-ui-dragable，我修复了它类似于 Iván Rodríguez，但还有一个用于 touchmove 的事件覆盖：
jQuery.event.special.touchstart = {
setup: function( _, ns, handle ) {
this.addEventListener('touchstart', handle, { passive: !ns.includes('noPreventDefault') });
}
};
jQuery.event.special.touchmove = {
setup: function( _, ns, handle ) {
this.addEventListener('touchmove', handle, { passive: !ns.includes('noPreventDefault') });
}
};
在 Laravel 的 select2 下拉插件中也会遇到这个。按照 Alfred Wallace 的建议更改值
this.element.addEventListener(t, e, !1)
到
this.element.addEventListener(t, e, { passive: true} )
解决了这个问题。为什么他投反对票，我不知道，但这对我有用。
以下库解决了该问题。
只需将此代码添加到您的项目中即可。
<script type="text/javascript" src="https://unpkg.com/default-passive-events"></script>
如果您需要更多信息，请访问该图书馆。
其它你可能感兴趣的问题