JS監聽手機端瀏覽器的後退按鈕的事件方法
轉載地址:http://www.jb51.net/article/89921.htm
首先我們要了解瀏覽器的history。
大家知道在頁面中我們可以使用javascript window history,後退到前面頁面,但是由於安全原因javascript不允許修改history裡已有的url連結,但可以使用pushState方法往history裡增加url連結,並且提供popstate事件監測從history棧裡彈出url。既然有提供popstate事件監測,那麼我們就可以進行監聽。
返回、後退、上一頁按鈕點選監聽實現程式碼:
1 2 3 |
|
雖然我們監聽到了後退事件,但是頁面還是會返回上一個頁面,所以我們需要使用pushState增加一個本頁的url,代表本頁,大家都非常清楚是#
1 2 3 4 5 6 7 |
"#"
|
當進入該頁面,我們就給這個history壓入一個本地的連線。當點選返回、後退及上一頁的操作時,就進行監聽,在監聽程式碼中實現自己操作。
下面是完整的程式碼:
1 2 3 4 5 6 7 8 9 10 11 12 13 |
); //根據自己的需求實現自己的功能
|
PC端瀏覽器使用jquery監聽
$(document).ready(function(e) {
var counter = 0;
if (window.history && window.history.pushState) {
$(window).on('popstate', function () {
window.history.pushState('forward', null, '#');
window.history.forward(1);
window.location.href='/PF_ECP/po/kefumishu.shtml';//跳轉到個人中心
});
}
window.history.pushState('forward', null, '#'); //在IE中必須得有這兩行
window.history.forward(1);
});