2011-11-21 62 views
5

我已經開始測試History.js。瞭解它的工作原理,並且沒有popstate,而是有statechange。當我按下瀏覽器的後退按鈕時,我正在尋找一種不同的方法。History.js中有沒有方法知道按下後退按鈕

原因是我需要知道狀態移動之前的URL,從我要去的那個。該項目包含gist,只查看我們所訪問的網址。

我希望解決的辦法是不要跟蹤全局變量中訪問的最新URL。

感謝

回答

4

我知道這是一個相當陳舊的問題,但我想出了一個解決問題的一個標準頁和歷史狀態頁面之間切換時,前進/後退鍵。

方案:使用 HTML5歷史(或history.js插件)在一組頁面 然後其他頁面,我們需要真正的負荷,又稱標準頁(不要問爲什麼,但也有一定的用例,這可能需要)

當您從歷史狀態頁面前往,並且執行實際加載到標準頁面時。你不能回去:它改變網址,但不加載頁面 - 它只激發一個狀態變化;我認爲這是原帖的問題。我的個人意見是,這是一個瀏覽器錯誤(所有瀏覽器都有問題),因爲瀏覽器應該知道您正在瀏覽的頁面已重新加載到歷史記錄狀態頁面之外。

我使用一些非常簡單的方法解決了這個問題: 監聽statechange事件,並在觸發時告訴瀏覽器刷新。這種方式我不在乎他們是否返回或轉出此頁面。如果瀏覽器認爲狀態正在改變(鏈接不會觸發statechange事件),只有後退/前進INTO歷史狀態頁面會觸發此事件,因此它可以解決問題。

代碼,使用jQuery + History.js插件:

$(window).on('statechange', function() { 
    window.location.reload(); 
}); 

如果這是沒有意義的,你可能沒有這個問題。然而,我注意到許多網站上的這個使用HTML 5的歷史(即使pinterest.com有這個問題,如果你重新加載時,圖像模態,然後嘗試返回)。

我們希望,如果你確實有這個問題,你會發現這個答案,有一種如釋重負的嘆息巨大:)

+2

我曾想過類似的邏輯,但是,當發出pushState和按下後退/前進時會觸發statechange,從而創建無限重新加載循環。 – Dean

+0

事實上,一個巨大的緩解。我正要放棄。 –

17

我發現在GitHub上的解決方案是有點過頭了,我的目的。我創建了一個總是正確的布爾,除了之前我使用History來更改狀態時。

var manualStateChange = true; 

History.Adapter.bind(window,'statechange',function(){ 
    if(manualStateChange == true){ 
    // BACK BUTTON WAS PRESSED 
    } 
    manualStateChange = true; 
}); 

任何時候,我以編程方式更改的狀態,設置布爾爲false:

manualStateChange = false; 
History.pushState(null, null, currentPath); 
+0

好的想法... – JDandChips

+1

我做了同樣的事情,但是這不會區分'後退'和'前進'按鈕。 – GTCrais

+0

這正是我所需要的,謝謝:D ...我只需要位於'// BACK BUTTON PRESSED'位的'location.reload()',所以'back'和'forward'不是一個問題:D –

0

在「官方」版本,此功能將不可用。嘗試在主文件中使用此文件: https://github.com/danger89/history.js/blob/master/scripts/bundled/html5/jquery.history.js

我無法保證他的解決方案適用於每個瀏覽器。但這是一個很好的解決方案。如果你申請了他的變化,你可以使用:

var State = History.getState(); 
if (State.navigation) { 
    // Back/forward button is pressed. 
} 

更多信息,請Github issue 47找到。

0

與James Wagoner相似的答案。 'statechange'事件被雙方解僱,所以我只檢查'popstate'事件,在我的情況下只在用戶返回時調用。

window.addEventListener('popstate', function() { 
    window.location.reload(); 
}); 
相關問題