今天遇到一個問題，以前給整個網站上的連接加了loading，今天遇到在ios的chrome和safari下點擊進入新頁面而後點擊瀏覽器的返回按鈕，loading還在，而且一直存在，最後網上搜到了解決方案特記錄下

 

點擊事件加loading：

$(document).on("click", "a[href!=''][href!='#'][href!='javascript:void(0)'][href!='javascript:void(0);'][href!='javascript:;']", function () {
    var href = $(this).attr('href');
    var target = $(this).attr('target');
    var a_pageindex = $(this).data("pageindex");

    if ($(this).hasClass('fancybox')) {
        //彈出層的不loading
    } else if (target != undefined && target == "_blank") {
        //有_blank的不loading
    } else if (href == undefined || href.indexOf("plus.google.com") > 0) {
        //沒有href的不loading 或者google分享不loading
    } else if ($(this).data("pageindex") != undefined) {
        //ajax 分頁空間的分頁按鈕不須要
    } else if (isCtrl) {
        //若是按着ctrl鍵不執行
    } else {
        //href中以#開頭的不loading
        if (href.substring(0, 1) != '#' && href.indexOf("javascript:") == -1) {
            LinkLoading(true);
        }

    }
});

解決ios的chrome和safari返回繼續loading：

//瀏覽器回退頁面一直轉圈
if ($(window).width() < 1024) {
    var detectBack = {
        initialize: function () {
            //監聽hashchange事件
            window.addEventListener('hashchange', function () {
                //爲當前導航頁附加一個tag
                this.history.replaceState('hasHash', '', '');

            }, false);

            history.pushState(1, '', '')
            window.onpopstate = function (e) {
                if (!e.state) {
　　　　　　　　　　　　//fix chrome
                    window.history.back();
                    //偵測是用戶觸發的後退操做, dosomething
                    //這裏刷新當前url
                    //window.location.reload();
                }
            };
        }
    }
    detectBack.initialize();
    //fix ios safair
    window.onpageshow = function (event) {
        if (event.persisted) {
            window.location.reload()
        }
    };
}

 最後通過試驗，無論chrome仍是safari這樣就能夠了

 

//瀏覽器回退頁面一直轉圈
if ($(window).width() < 1024) {
    window.onpageshow = function (event) {
        if (event.persisted) {
            LinkLoading(false);
　　　　　　　//下邊的看狀況添加
　　　　　　　//location.reload();

        }
    };
}

定義和用法

onpageshow 事件在用戶瀏覽網頁時觸發。

onpageshow 事件相似於 onload 事件，onload 事件在頁面第一次加載時觸發， onpageshow 事件在每次加載頁面時觸發，即 onload 事件在頁面從瀏覽器緩存中讀取時不觸發。

爲了查看頁面是直接從服務器上載入仍是從緩存中讀取，你能夠使用 PageTransitionEvent 對象的 persisted 屬性來判斷。 若是頁面從瀏覽器的緩存中讀取該屬性返回 ture，不然返回 false 

 

 

參考：https://code.ziqiangxuetang.com/jsref/event-onpageshow.html