為另一個網頁中加載的網頁添加“后退”按鈕

Question

我有一個index.php其中包含兩個主要部分： navbar和main-content 。 navbar包含鏈接，這些鏈接將通過此jQuery代碼將另一個網頁加載到main-content ：

jQuery('#main-content').load('sampleurl');

其中一些網頁包含指向另一個網頁的鏈接，因此我想添加一個后退按鈕。 我嘗試使用history.back()和history.go(-1)以及$_SERVER['HTTP_REFERER'] ，但是在我的情況下它們實際上並不起作用。

在這種情況下，如何添加后退按鈕？

Answer 1

您應該將上次瀏覽的頁面保留在JavaScript變量中或隱藏輸入的值中，然后只需添加帶有

jQuery('#main-content').load(old_url);

通過jQuery('#main-content').load('sampleurl');加載下一頁時，必須始終更新變量jQuery('#main-content').load('sampleurl');

Answer 2

一個想法：每次加載頁面時，將哈希添加到Url； 然后您可以使用history.back()

$(function(){
  if(window.location.hash === 'sampleurl'){
    jQuery('#main-content').load('sampleurl', function(){
      window.location.hash = 'sampleurl'; //<<-- match with your loaded page;
    });
  }
});

祝好運 ！

Answer 3

嘗試操縱javascript位置或location.hash

https://developer.mozilla.org/en-US/docs/DOM/window.location

當然，您還需要能夠將URL轉換回相關的頁面內容。

Answer 4

結合Charlie和Michael的答案，由於您已經在使用jQuery，所以另一個選擇是包括jQuery Address插件 。

您可以通過創建一個讀取散列路徑以加載新內容的函數來實現此想法。 之后，可以通過內置的后退+前進按鈕瀏覽內容。 我預見到此實現的唯一挑戰是將新內容與哈希路徑相關聯。

祝好運！