? ? ? ? 在ios10.2系統(tǒng)之下抗悍,微信內(nèi)核升級(jí)為WKwebview內(nèi)核之后滤否,進(jìn)行了一系列改變佣盒,其中一部分便是返回按鈕事件,取消了返回之后的刷新功能顽聂。
? ? ? ?而在實(shí)際的應(yīng)用中,我們常常需要實(shí)現(xiàn)在移動(dòng)app和瀏覽器中點(diǎn)擊返回盯仪、后退紊搪、上一頁(yè)等按鈕實(shí)現(xiàn)自己的關(guān)閉頁(yè)面、調(diào)整到指定頁(yè)面或執(zhí)行一些其它操作的需求全景,那在代碼中怎樣監(jiān)聽(tīng)當(dāng)點(diǎn)擊微信耀石、支付寶、百度糯米爸黄、百度錢(qián)包等app的返回按鈕或者瀏覽器的上一頁(yè)或后退按鈕的事件呢滞伟?
? ? ? ? 首先我們需要知道如何來(lái)監(jiān)聽(tīng)這個(gè)返回事件:
返回、后退炕贵、上一頁(yè)按鈕點(diǎn)擊監(jiān)聽(tīng)實(shí)現(xiàn)代碼:
window.addEventListener("popstate",function(e) {
? ? ? ?alert("我監(jiān)聽(tīng)到了瀏覽器的返回按鈕事件啦");//根據(jù)自己的需求實(shí)現(xiàn)自己的功能
},false);
? ? ? ?然后我們要了解H5的history梆奈,,它的API如下:
1. history.pushState與history.replaceState称开。
A)history.length:當(dāng)前歷史列表中的歷史記錄數(shù)(我大概測(cè)了下亩钟,IE6+是從0開(kāi)始的乓梨,其他的是從1開(kāi)始的,若有誤請(qǐng)反饋哈清酥,(^_^)扶镀;
B)history.Go(n):前進(jìn)或后退n條記錄,當(dāng)n=0或空時(shí)會(huì)刷新當(dāng)前頁(yè)焰轻;
C)history.back():后退一步臭觉;
D)history.forward():前進(jìn)一步;
2.HTML5新增的API
A)history.pushState(data, title [, url]):往歷史記錄堆棧頂部添加一條記錄; data會(huì)在onpopstate事件觸發(fā)時(shí)作為
參數(shù)傳遞過(guò)去辱志;title為頁(yè)面標(biāo)題蝠筑,當(dāng)前所有瀏覽器都會(huì) 忽略此參數(shù);url為頁(yè)面地址荸频,可選菱肖,缺省為當(dāng)前頁(yè)地址;
B)history.replaceState(data, title [, url]) :更改當(dāng)前的歷史記錄旭从,參數(shù)同上稳强;
C)history.state:用于存儲(chǔ)以上方法的data數(shù)據(jù),不同瀏覽器的讀寫(xiě)權(quán)限不一樣和悦;
D)window.onpopstate:響應(yīng)pushState或replaceState的調(diào)用退疫;有了這幾個(gè)新的API,針對(duì)支持的瀏覽器鸽素,