摘要:卸載更新講的就是事件,當(dāng)頁面關(guān)閉后會(huì)觸發(fā)。想在某個(gè)頁面中使用這個(gè)攔截的大體思路是在進(jìn)入這個(gè)頁面的時(shí)候掛載該事件,跳轉(zhuǎn)頁面的時(shí)候?qū)燧d的事件取消。
1、onbeforeunload是什么玩意兒
onbeforeunload是一個(gè)事件,當(dāng)頁面將要被卸載(更新)的時(shí)候會(huì)被觸發(fā)。
卸載(更新)講的就是unload事件,當(dāng)頁面關(guān)閉后,會(huì)觸發(fā)。
2、語法規(guī)則window.onbeforeunload = funcRef
funcRef指的是一個(gè)方法,也就是一個(gè)函數(shù)引用。
3、怎么使用這個(gè)東西 3.1在HTML中,直接掛載到body上3.2在js中,使用window.onbeforeunload綁定方法test
3.3在單頁面中使用:test
一般在項(xiàng)目中直接使用window或者body會(huì)導(dǎo)致整個(gè)項(xiàng)目的頁面的刷新關(guān)閉事件都被攔截。
想在某個(gè)頁面中使用這個(gè)攔截的大體思路是在進(jìn)入這個(gè)頁面的時(shí)候掛載該事件,跳轉(zhuǎn)頁面的時(shí)候?qū)燧d的事件取消。
例如在react中:
componentDidMount() { window.onbeforeunload = function() { return "真的離開?"; }; } componentWillUnmount(){ window.onbeforeunload = function() { return null; } }以上
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/98693.html
摘要:解決思路對(duì)于瀏覽器的關(guān)閉和刷新會(huì)觸發(fā)兩個(gè)事件和,問題在于如何區(qū)分用戶是想刷新還是退出此時(shí)應(yīng)該將用戶催眠,然后獲得用戶的思想,預(yù)判用戶走位及操作。。。事件是無法阻止頁面關(guān)閉的。 需求背景: 為保證‘高度安全性’,用戶每次退出頁面或?yàn)g覽器都要清除登陸信息,每次進(jìn)入系統(tǒng)都要重新登陸(每次登陸還要手機(jī)驗(yàn)證碼等亂七八糟的驗(yàn)證信息,,,求用戶的心里陰影面積),但是刷新頁面不可以清除登陸信息。解決思...
摘要:坑無視和是十分特殊的事件,要求事件處理函數(shù)內(nèi)部不能阻塞當(dāng)前線程,而卻恰恰就會(huì)阻塞當(dāng)前線程,因此規(guī)范中以明確在和中直接無視這幾個(gè)方法的調(diào)用。 前言 ?最近實(shí)施的同事報(bào)障,說用戶審批流程后直接關(guān)閉瀏覽器,操作十余次后系統(tǒng)就報(bào)用戶會(huì)話數(shù)超過上限,咨詢4A同事后得知登陸后需要顯式調(diào)用登出API才能清理4A端,否則必然會(huì)超出會(huì)話上限。?即使在頁面上增添一個(gè)登出按鈕也無法保證用戶不會(huì)直接關(guān)掉瀏覽器...
摘要:與此同時(shí),我們獲得了回調(diào)函數(shù)的句柄,從而可以隨時(shí)從元素上移除相應(yīng)的事件監(jiān)聽。對(duì)象會(huì)被作為第一個(gè)參數(shù)傳遞給事件監(jiān)聽的回調(diào)函數(shù)。 Click、touch、load、drag、change、input、error、risize — 這些都是冗長的DOM(文檔對(duì)象模型)事件列表的一部分。事件可以在文檔(Document)結(jié)構(gòu)的任何部分被觸發(fā),觸發(fā)者可以是用戶操作,也可以是瀏覽器本身。事件并不是...
摘要:事件事件在用戶退出頁面時(shí)發(fā)生。注意事件同樣觸發(fā)了頁面載入事件事件。如圖所示大體一句話描述和支持事件但是或者不支持該事件。瀏覽器兼容情況完美支持不支持文字提醒信息不支持如圖所示使用遇到的凡是標(biāo)簽都會(huì)觸發(fā)事件包括這種。 簡介 onunload,onbeforeunload都是在刷新或關(guān)閉時(shí)調(diào)用,可以在腳本中通過 window.onunload來調(diào)用。區(qū)別在于onbeforeunload在o...
閱讀 3891·2021-09-10 11:22
閱讀 2365·2021-09-03 10:30
閱讀 3677·2019-08-30 15:55
閱讀 1921·2019-08-30 15:44
閱讀 855·2019-08-30 15:44
閱讀 603·2019-08-30 14:04
閱讀 3056·2019-08-29 17:18
閱讀 1278·2019-08-29 15:04