今天做項目的時候突然遇到一個需求,實現js改變地址欄地址而不跳轉新頁面,上網搜沒有搜到我想要的方法,后來自己很奇妙的碰對了,貼出來分享一下
我的背景是從一個頁面點擊鏈接跳轉到本頁面(http://caojiejun.snslearn.com/open/Index/openAp)時會自動到所要跳轉的內容段,這個時候肯定需要它帶過來一個參數,在這里即是 apiAgreement。所以網址是http://caojiejun.snslearn.com/open/Index/openAp?id=apiAgreement
我在本頁面的時候也有一個地方點擊能跳轉到一樣的位置,但是我可以直接在本頁面由顯示隱藏來控制跳轉,就免去了刷新頁面帶來的其它比較困擾的問題。而且效率快。那么問題來了,這個網址復制到新窗口打開的時候並不是這個內容頁。
恩,這個時候如果我能改變網址並且不讓它重新跳轉,就很完美了。
接下來優化:
其它頁面點擊跳轉的鏈接改成(傳參方式改變):http://***.com/open/Index/openApi#/apiAgreement
這里順便貼一下本頁面獲取參數的函數:
function get_url_params() { //獲取url里面的id參數
var w_t = window.location.href.split('/');
var len = w_t.length - 1;
var w_id = w_t[len];
return w_id;
}
在本頁面改變url網址:
點擊事件
{
var id=$(this).attr("data-id");
window.location.href = "#/"+id;
}
當前網址就變成了http://***.com/open/Index/openApi#/ +你點擊事件里面的id。並且沒有刷新頁面,網址復制到新窗口也是想要的效果。