微信端返回按钮监听处理

微信端监听‘返回’事件

下面的方法是在移动端实现的，在微信的浏览器中beforeunload等是被阉割掉的，所以用不了。
而下面的方法存在的问题是：当前页面通过点击事件进入下级页面后，再返回到当前页会直接触发popstate事件，也就意味着会直接弹出confirm，并且当你点击‘确认’的时候，需要点击多次才能返回。出现这两个问题的原因是：
1、popstate事件不可被移除，当你从子页面返回的时候，popstate会被触发（ios并不会刷页面），并且执行
2、子页面返回会往history栈中添加一条历史记录，所以在返回的时候不会跳转回去，并且因为当前页面重写了pushState，所以会出现停留在当前页

因此，这边进行的处理就是在页面加载后直接进行window.location.back();同时，对事件的执行进行延迟

// 判断点击左上角返回
$(document).ready(function (e) {
// 最好写在页面加载请求的接口中
if(window.location.hash === '#hash'){
    window.history.back();
}
pushHistory();

let bool = false;
setTimeout(function () {
    bool = true;
}, 1500);
    window.addEventListener('popstate', function (e) {
       if(bool) {
            var cfi = confirm("确定要离开当前页面嘛？");
            if(cfi) {
                window.history.back();
            }else{
                document.write("You pressed cancel!")
            }
        }
    }, false);
    function pushHistory () {
        let state = {
            title: 'title',
            url: '#'
        };
        window.history.pushState(state, 'title', '#');
    }
});

附上，popstate是h5新出的api，还有用于监听hash的api叫hashchange，就是监听跟在＃符号后面的URL部分，包括＃符号变化，但是hashchange不管是back，还是forward都会触发。