为滚动阻止“touchstart”事件添加了非被动事件侦听器

Question

突然间，我突然无处可去，在我们网站的每一页上都开始提到这个

Added non-passive event listener to a scroll-blocking 'touchstart' event.
Consider marking event handler as 'passive' to make the page more responsive

它不仅仅是一两次......它就像成千上万的......

他们正在疯狂。

阻止大量违规行为的唯一方法就是注释掉这一行

  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>

我阅读了其他关于此违规行为意味着什么的帖子，但我真的看不到我在两小时前和现在之间做了什么不同（我做了一次完全回滚，看它是否有帮助）

它几乎就像有人把一个bug放到了jquery.min.js中，但是我非常怀疑这个因为每个人都会得到它。

有什么想法吗？我试着尽我所能调试，我仍然不知道是什么原因导致的？！？

更新

我替换了所有<button><md-tooltip>text</md-tooltip></button>宽度<button data-toggle="tooltip" title="text"></button>这删除了99％的违规行为。

Answer 1

这解决了我的问题：

jQuery.event.special.touchstart = {
  setup: function( _, ns, handle ){
    if ( ns.includes("noPreventDefault") ) {
      this.addEventListener("touchstart", handle, { passive: false });
    } else {
      this.addEventListener("touchstart", handle, { passive: true });
    }
  }
};

Answer 2

好的再深入一点，这不是一个新的行为，它已经被报道了，jQuery仍然没有修复它。

问题在于，对于处理程序为passive，必须确保永远不会调用preventDefault()，但jQuery事先并不知道......

我能给你的唯一提示是更改你的控制台日志记录级别并删除＆＃34;详细＆＃34;。关注this issue关于解决此问题的想法。

Answer 3

我正在使用各种事件，这似乎可以解决我的用例

(function () {
    var func = EventTarget.prototype.addEventListener;

    EventTarget.prototype.addEventListener = function (type, fn, capture) {
        this.func = func;
        capture = capture || {};
        capture.passive = false;
        this.func(type, fn, capture);
    };
}());

Answer 4

我认为除了基于触摸的事件之外，您还可以添加基于滚动的修复程序，以防止谷歌页面分数将其标记为桌面与移动：

jQuery.event.special.wheel = {
    setup: function( _, ns, handle ){
        this.addEventListener("wheel", handle, { passive: true });
    }
};
jQuery.event.special.mousewheel = {
    setup: function( _, ns, handle ){
        this.addEventListener("mousewheel", handle, { passive: true });
    }
};

Answer 5

来自Sergio的答案是正确的，将其添加到底部的jquery脚本中。如果出现touchstart和touchmove问题，只需添加相同的代码，然后将touchstart替换为touchmove，如下所示：

jQuery.event.special.touchstart = {
  setup: function( _, ns, handle ){
    if ( ns.includes("noPreventDefault") ) {
      this.addEventListener("touchstart", handle, { passive: false });
    } else {
      this.addEventListener("touchstart", handle, { passive: true });
    }
  }
};
jQuery.event.special.touchmove = {
  setup: function( _, ns, handle ){
    if ( ns.includes("noPreventDefault") ) {
      this.addEventListener("touchmove", handle, { passive: false });
    } else {
      this.addEventListener("touchmove", handle, { passive: true });
    }
  }
};