在項目運行過程中發現，用戶在有左右滑動前進后退的功能的瀏覽器上簽字時，偶然觸發了前進后退會導致canvas像是重置了一樣內容消失，所以需要在代碼中處理這種情況。

基本原理就是在touchmove事件中阻止默認事件，使瀏覽器不會觸發前進后退事件，但是也會無法觸發scroll事件讓頁面正常滾動，后續如何讓頁面能正常滾動就會有多種思路。

參考https://www.cnblogs.com/Miracle-ZLZ/p/7852421.html文中第5點推薦使用IScroll，但看了一下github發現太久沒有更新了，我就用了基于IScroll的better-scroll，文檔：https://better-scroll.github.io/docs/zh-CN/guide/base-scroll.html

在 BetterScroll 2.0 的設計當中，我們抽象了核心滾動部分，它作為 BetterScroll 的最小使用單元，壓縮體積比 1.0 小了將近三分之一，往往你可能只需要完成一個純粹的滾動需求，那么你只需要引入這一個庫，方式如下：

npm install @better-scroll/core@next --save

import BScroll from '@better-scroll/core'

const bs = new BScroll('.div')

這是文檔中核心滾動的介紹，非常輕量，非常適合我們只是簡單的想要解決瀏覽器左右滑動前進后退這一問題，具體用法可以參考文檔。

完結

總結

以上是生活随笔為你收集整理的谷歌浏览器禁止右滑返回历史_移动端h5禁用浏览器左滑右滑的前进后退功能的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。