一、監(jiān)聽微信、支付寶等移動app及瀏覽器的返回酬诀、后退、上一頁按鈕的事件方法
window.addEventListener("popstate", function(e) {
alert("我監(jiān)聽到了瀏覽器的返回按鈕事件啦");//根據(jù)自己的需求實現(xiàn)自己的功能
}, false);
雖然我們監(jiān)聽到了后退事件骆撇,但是頁面還是會返回上一個頁面瞒御,所以我們需要使用pushState增加一個本頁的url,代表本頁,大家都非常清楚是#
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
}
$(function(){
pushHistory();
window.addEventListener("popstate", function(e) {
alert("我監(jiān)聽到了瀏覽器的返回按鈕事件啦");//根據(jù)自己的需求實現(xiàn)自己的功能
}, false);
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title", "#");
}
});
在微信中進入頁面就觸發(fā)了popstate事件神郊。
解決方法:定義boolean 變量bool=false肴裙。在頁面加載后,采用setTimeout方法設(shè)置1.5s的超時屿岂,在超時執(zhí)行方法中設(shè)置bool=true践宴。
在popstate監(jiān)聽當中增加對bool的判斷,當bool=true時爷怀,執(zhí)行內(nèi)容阻肩。具體代碼如下:
$(function(){
pushHistory();
var bool=false;
setTimeout(function(){
bool=true;
},1500);
window.addEventListener("popstate", function(e) {
if(bool)
{
alert("我監(jiān)聽到了瀏覽器的返回按鈕事件啦");//根據(jù)自己的需求實現(xiàn)自己的功能
}
pushHistory();
}, false);
});