js 實(shí)現(xiàn)在離開頁面時(shí)提醒未保存的信息(減少用戶重復(fù)操作)
更新時(shí)間：2013年01月16日 11:06:24 作者：
在離開頁面時(shí)判斷是否有未保存的輸入值,然后進(jìn)行提醒，接下來介紹實(shí)現(xiàn)步驟，感興趣的朋友可以了解下
Javascript代碼
//在離開頁面時(shí)判斷是否有未保存的輸入值
var hasSaved = false;//是否有輸入的內(nèi)容未保存標(biāo)志，初始值為false
function CheckUnsave(){
if(hasSaved==false){
alert("您上傳的東西尚未保存，請保存后再離開頁面");
return false;}
//return true; //不能加這個(gè)語句
}
//保存了則改變狀態(tài)
function ChangeState()
{
hasSaved = true;
}
</script>
在body中加入屬性onbeforeunload
Html代碼
<body onbeforeunload="return CheckUnsave();"><!--一定要加return-->
要在提交action之前調(diào)用ChangeState.
如果按下某個(gè)按鈕后離開頁面則不再提醒，比如保存的按鈕，則要在保存的按鈕按下以后，要修改下是否保存的標(biāo)志符的狀態(tài)eg：
Html代碼
<input type="submit" name="Submit" value="保 存" onClick="ChangeState();">
復(fù)制代碼 代碼如下:
//在離開頁面時(shí)判斷是否有未保存的輸入值
var hasSaved = false;//是否有輸入的內(nèi)容未保存標(biāo)志，初始值為false
function CheckUnsave(){
if(hasSaved==false){
alert("您上傳的東西尚未保存，請保存后再離開頁面");
return false;}
//return true; //不能加這個(gè)語句
}
//保存了則改變狀態(tài)
function ChangeState()
{
hasSaved = true;
}
</script>
在body中加入屬性onbeforeunload
Html代碼
復(fù)制代碼 代碼如下:
<body onbeforeunload="return CheckUnsave();"><!--一定要加return-->
要在提交action之前調(diào)用ChangeState.
如果按下某個(gè)按鈕后離開頁面則不再提醒，比如保存的按鈕，則要在保存的按鈕按下以后，要修改下是否保存的標(biāo)志符的狀態(tài)eg：
Html代碼
復(fù)制代碼 代碼如下:
<input type="submit" name="Submit" value="保 存" onClick="ChangeState();">
相關(guān)文章
javascript數(shù)組對象常用api函數(shù)小結(jié)(連接,插入,刪除,反轉(zhuǎn),排序等)
這篇文章主要介紹了javascript數(shù)組對象常用api函數(shù),結(jié)合實(shí)例形式總結(jié)分析了javascript針對數(shù)組的連接、刪除、反轉(zhuǎn)、排序、插入等操作相關(guān)函數(shù)用法,需要的朋友可以參考下2016-09-09
通過這篇文章幫助大家快速學(xué)習(xí)JavaScript DOM操作基礎(chǔ)的相關(guān)知識(shí)，本文給大家介紹的非常詳細(xì)，感興趣的朋友跟隨小編一起看看吧2021-04-04
JavaScript中的canvas?實(shí)現(xiàn)一個(gè)圓環(huán)漸變倒計(jì)時(shí)效果
這篇文章主要介紹了JavaScript中的canvas?實(shí)現(xiàn)一個(gè)圓環(huán)漸變倒計(jì)時(shí)效果，文章圍繞主題展開詳細(xì)的內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下2022-09-09
這篇文章主要為大家詳細(xì)介紹了Javascript中的async函數(shù)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-03-03
JavaScript隱式類型轉(zhuǎn)換代碼實(shí)例
這篇文章主要介紹了JavaScript隱式類型轉(zhuǎn)換代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-05-05
javascript基于HTML5 canvas制作畫箭頭組件
該組件實(shí)現(xiàn)了根據(jù)箭頭起止點(diǎn)坐標(biāo)畫箭頭功能。目前組件可設(shè)置箭頭形狀（大小和角度）。2014-06-06
uniapp幾行代碼解決滾動(dòng)穿透問題(項(xiàng)目實(shí)戰(zhàn))
這篇文章主要介紹了uniapp幾行代碼解決滾動(dòng)穿透問題,本文結(jié)合實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-01-01
js中find、findIndex、indexOf的用法和區(qū)別
本文主要介紹了js中find、findIndex、indexOf的用法和區(qū)別，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-07-07
JavaScript最完整的深淺拷貝實(shí)現(xiàn)方式詳解
這篇文章主要為大家詳細(xì)介紹了JavaScript最完整的深淺拷貝實(shí)現(xiàn)方式，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-02-02
js 樹組復(fù)制方法2009-02-02