2013-07-09 68 views
1

是否有一個庫或一段代碼使特定按鈕的行爲像一個正確的瀏覽器後退按鈕,它會將您帶到之前加載的上一頁?html5/jquery返回按鈕

目前我只是指定了我以前加載的頁面的href,但得出的結論是,這不起作用,因爲屏幕可能已經從不同的屏幕訪問。

有沒有這樣的例子還是我需要創建自己的邏輯,跟蹤頁面歷史記錄一些如何?

感謝

+0

您使用的是單文件還是多文件模板? – Omar

+0

單個文件atm,但將在我的答案中提到的jQM中使用'$ .mobile.changePage()'後面的將JS移動到JS文件中 – jonney

+0

。檢查這個演示http://jsfiddle.net/Palestinian/YMTzU/ – Omar

回答

2

導航回 - 單文件模板:

$('.selector').on('click', function (e) { 
    e.preventDefault(); 
    var page = $.mobile.activePage.prev('[data-role=page]'); 
    $.mobile.changePage(page, { 
    transition: 'flip', 
    reverse: true 
    }); 
}); 

導航回 - 多文件模板:

$('.selector').on('click', function (e) { 
    e.preventDefault(); 
    var page = document.referrer; 
    $.mobile.changePage(page, { 
    transition: 'flip', 
    reverse: true 
    }); 
}); 

Demo

+0

不返回屏幕 – jonney

+0

@jonney是否在頁面或.html文件之間導航? – Omar

+0

.html文件我正在導航 – jonney

6

您可以使用JavaScript背法;

function backButton() { 
    window.history.back() 
} 

<a onclick="backButton()">Go back</a> 

或者不同的方法;

<a onclick="history.go(-1);">Go back</a> 
+1

或者對於我們這些不喜歡在html中放置代碼的人,純js方法:'$('body')。find('。go ('click',function(){window.history.back();});'用html:'Go back' –

+0

乾杯訣竅 – jonney

+0

@jonney答案是正確的,會失去過渡效果。 – Omar