[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive.


1. 

由於瀏覽器必須要在執行事件處理函數之后,才能知道有沒有掉用過 preventDefault() ,這就導致了瀏覽器不能及時響應滾動,略有延遲。

所以為了讓頁面滾動的效果如絲般順滑,從 chrome56 開始,在 window、document 和 body 上注冊的 touchstart 和 touchmove 事件處理函數,會默認為是 passive: true。瀏覽器忽略 preventDefault() 就可以第一時間滾動了。

2. 解決:

    2-1. 為容器設置css屬性touch-action,去除滑動時默認現象產生,但不影響事件觸發
      touch-action: none;   

    2-2. 注冊處理函數時,用如下方式,明確聲明為不是被動的

  window.addEventListener('touchmove', func, { passive: false }) 
    


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM