[html]history禁用瀏覽器的後退功能(包括其他操作後退的按鈕,操作等)
前端在編寫程式碼的時候可能會使用到禁用瀏覽器的後退功能,為使後退功能更加的完善,所以需要禁用掉很多的其他操作,比如鍵盤的按鈕,組合快捷鍵等等。
這裡是一段關於js完全禁用瀏覽器後退的功能。
<script language="javascript">
//防止頁面後退
history.pushState(null, null, document.URL);
window.addEventListener(`popstate`, function () {
history.pushState(null, null, document.URL);
});
</script>
在一般的html中使用這個功能時,對整個頁面都會啟用禁用的功能;
在vue等的spa專案中使用,你可以在統一的地方進行及時的後退功能的禁用。那麼,我們應該這樣描述:
export function disableHistory (url) {
//防止頁面後退
history.pushState(null, null, url);
window.addEventListener(`popstate`, function () {
history.pushState(null, null, url);
})
}
同時我們在進入某個頁面的時候就可以去執行這個函式:
import { disableHistory } from ‘./disableHistory’
export default {
beforeCreate () {
disableHistory(document.URL)
},
// ...
}
雖然我們不能直接一起禁用掉我們想禁用的所有頁面,但是我們的頁面顯示也是互斥的,即一個瀏覽器tab不能一次顯示多個頁面,只能含有一個url。只要我們在想禁用的頁面顯示之前或者使用者操作後退之前禁用掉即可。
當然你也可以使用這個函式來實現更改url但頁面不進行重新整理的操作!
相關文章
- 監聽瀏覽器的後退事件瀏覽器事件
- 08-棧:如何實現瀏覽器的前進和後退功能?瀏覽器
- Chrome將強化“後退”按鈕 打擊後退至廣告頁行為Chrome
- Google Chrome將不再允許網站劫持後退按鈕GoChrome網站
- Ios、Android微信瀏覽器後退跳轉實現,及遇到的bugiOSAndroid瀏覽器
- win10系統瀏覽器閃退怎麼辦 win10瀏覽器閃退的方法Win10瀏覽器
- HTML5中History.back()頁面後退重新整理頁面HTML
- iframe在更改了src之後,不出現後退或者前進按鈕怎麼解決?
- Win10系統ie瀏覽器閃退該怎麼辦 Win10系統ie瀏覽器閃退的方法Win10瀏覽器
- 為什麼win10瀏覽器總是閃退_win10瀏覽器閃退是怎麼回事Win10瀏覽器
- iOS重新簽名如何操作?重籤後閃退如何解決?iOS
- 每日安全資訊:Google Chrome將不再允許網站劫持後退按鈕GoChrome網站
- vue中前進重新整理、後退快取使用者瀏覽資料和瀏覽位置的實踐Vue快取
- VBA命令按鈕操作
- vue router路由自定義後退事件,並通知下個路由為後退Vue路由事件
- windows10 edge閃退怎麼辦_windows10 edge瀏覽器閃退修復Windows瀏覽器
- 怎麼退店?退店後能重新入駐嗎?
- [JS]bootstrapTable新增操作按鈕JSbootAPT
- python瀏覽器操作有哪些Python瀏覽器
- 隱藏在瀏覽器背後的“黑手”瀏覽器
- 如何為資料行的新增操作按鈕
- [BUG反饋]IE瀏覽器,百度瀏覽器,搜狗瀏覽器批量操作功能都不相容!!!!傲遊、火狐、谷歌瀏覽器可以瀏覽器谷歌
- Win10系統下Edge瀏覽器經常閃退的解決方法Win10瀏覽器
- 瀏覽器是如何渲染網頁的《學如逆水行舟,不進則退》瀏覽器網頁
- 谷歌瀏覽器禁用JavaScript谷歌瀏覽器JavaScript
- vue路由前進後退動畫Vue路由動畫
- vue router路由自定義後退事件Vue路由事件
- 瀏覽器中的JavaScript:文件物件模型與 DOM 操作瀏覽器JavaScript物件模型
- 在主要瀏覽器禁用後,SHA-1 使用量得到了下降瀏覽器
- Chrome 瀏覽器修改 UA 模擬其它瀏覽器,包括移動瀏覽器Chrome瀏覽器
- Win10系統如何更換操作中心的快速操作按鈕排序Win10排序
- golang 模擬瀏覽器登入操作Golang瀏覽器
- 基於Chromium的瀏覽器已上線通用“顯示密碼”按鈕瀏覽器密碼
- win10系統下Edge瀏覽器如何禁用InPrivate無痕瀏覽功能Win10瀏覽器
- 專案需要實現按鈕懸浮的功能, 實現後的記錄
- flutter demo (二):禁用按鈕Flutter
- 火狐瀏覽器禁用快取瀏覽器快取
- 關於 Angular 應用對瀏覽器 Back 按鈕支援問題的討論Angular瀏覽器