iphone微信後退不刷新的問題

  查看了很多解決ios微信返回不刷新頁面的文章,大部分都是利用H5的新特性history來進行解決的,而且很多人的想法都是用了pushstate和popstate來實現了這個功能,但是用pushstate之後會添加一個history實體,然後在監聽到時間觸發popstate的時候,刷新頁面的時候其實刷新的是剛纔添加的這個實體,這樣會陷入無限循環中,用戶將退不出這個頁面或者直接關閉這個頁面。下面的這種方法很好的解決了這個問題。

$(function() {
        pushHistory();
    });
    function pushHistory() {
        window.addEventListener("popstate", function(e) {
     //這裏監聽到了後退事件
            self.location.reload();
        }, false);
        var state = {
            title : "",
            url : "#"
        };
        window.history.replaceState(state, "", "#");
    };

Tips:

1.popState事件只有在作用go(-1),back(),forward()等操作時纔會觸發。 

2.重點是self.location.reload();,後退後刷新當前頁面。其它人寫的文章裏缺少這一塊,弄的我很是鬱悶。 

3.微信裏在監聽到iphone後退事件後會觸發popState事件,在PopState事件裏執行:self.location.reload();即可刷新後退後的頁面。

4.pustate增加了history的長度,在後退的時候會出錯,往往跳不出循環,而replace很好的解決了這個問題。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章