js改变地址栏而不跳转页面

今天做项目的时候突然遇到一个需求，实现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。并且没有刷新页面，网址复制到新窗口也是想要的效果。