引用自http://www.jb51.net/article/42240.htm

现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不复杂,是可以实现的,我们来编写些代码。来看看它是如何工作的。

<button onclick="justUrlChange()">点击-循环改变URL地址,但并不和后台交互</button>
<script type="text/javascript"> function justUrlChange(){
for(i=0;i<5;i++){
var j = i+10;
var stateObject = {id: j};//json格式
var title = "Wow Title "+i;
var newUrl = "/SpringMVC/teacher/inWhichRoom.do?id="+i;
history.pushState(stateObject,title,newUrl);
/* 第一个参数,是一个Json对象 , 在你储存有关当前URl的任意历史信息.
第二个参数,title 就相当于传递一个文档的标题 .
第三个参数是用来传递新的URL. 你将看到浏览器的地址栏发生变化而当前页面并没刷新。 */
}
} /* 现在运行,点击浏览器的返回按钮,查看URL是怎么改变的。
对于每次URL的改变,是因为它存储了历史状态“id”以及对应的值。
但是我们怎么重新获得历史状态,并且在此基础上做些事情呢?
我们需要对“popstate”添加事件监听器,这将会在每次历史对象的状态改变的时候触发。 */
window.addEventListener('popstate', function(event) {//给浏览器添加 "返回" 监听事件,且popstate必须小写
readState(event.state);//弹出的都是j的信息
}); /* 现在你会看到无论什么时候你点击返回按钮,
一个popstate事件就会被触发。
我们的事件侦听器然后检索历史状态对象与之关联的URL,并提示id的值 */
function readState(data){
alert(data.id);
}
</script>

使用JavaScript修改浏览器URL地址栏的实现代码【转】的更多相关文章

  1. 使用JavaScript修改浏览器URL地址栏的实现代码

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

  2. 使用 JavaScript 修改浏览器 URL 地址栏

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

  3. 使用JavaScript 修改浏览器 URL 地址栏

    现在的浏览器里,有一个十分有趣的功能,你可以在不刷新页面的情况下修改浏览器URL;在浏览过程中.你可以将浏览历史储存起来,当你在浏览器点击后退按钮的时候,你可以冲浏览历史上获得回退的信息,这听起来并不 ...

  4. JavaScript 无刷新修改浏览器URL地址栏

    //发现地址栏已改为:newUrlvar stateObject = {}; var title = "Wow Title"; var newUrl = "/my/awe ...

  5. HTML5 修改浏览器url而不刷新页面

    嘛,起因是黑子大叔在微博上的一条@信息,找起了这个的实现,看了一圈google的中文信息内似乎还没有怎么提到这个的内容,就发表上来. 详细效果就是类似于用Firefox4+/Chrome 5+/Saf ...

  6. javascript/jquery获取url地址栏参数的方法

    简洁jq方法获取url地址栏的参数 function getQueryVariable(variable){ var query = window.location.search.substring( ...

  7. 用JavaScript修改浏览器tab标题

    修改tab或者window的标题,是一项较老的实践.Gmail 用它来提示用户新的聊天消息,当有新的page通过AJAX加载的时候,本站同样用它更新tab title.这是怎样做到的呢?当时是通过设置 ...

  8. js修改浏览器url

    var stateObject = {};var title = "";var newUrl = "/";history.pushState(stateObje ...

  9. javascript检测浏览器的缩放状态实现代码 是指浏览器网页内容的百分比缩放(按Ctrl和+号键或者-号键的缩放)

    这里所说的缩放不是指浏览器大小的缩放,而是指浏览器网页内容的百分比缩放(按Ctrl和+号键或者-号键的缩放).检测这种缩放有很种方法,QQ空间都通过flash来检测浏览器是否处于缩放.这里提供java ...

随机推荐

  1. 从Silverlight到ExtJS再到BootStrap,DataTable(DataGrid)的样式格式化原理没变

    <table id="tableOrder" data-toolbar="tableBtnGroup" data-row-style="rowS ...

  2. Windows查看端口被什么进程占用的简单方法----菜鸟养成

    1.  还是因为同事告知Oracle的服务器连不上 最后发现改了端口就可以了, 但是很困惑 不知道为什么会这样,然后简单查了下: 命令 netstat -ano 查看监听的端口 baidu出来一个管道 ...

  3. Linux 多主机SSH互信操作---noob....

    创建虚拟机后-- ssh-keygen 生成公钥和私钥对 -rw------- 1 root root 1679 11月 4 09:18 id_rsa-rw-r--r-- 1 root root 39 ...

  4. Linux基础学习(9)--文件系统管理

    第九章——文件系统管理 一.回顾分区和文件系统 1.分区类型: 2.分区表示方法: 3.文件系统: 二.文件系统常用命令 1.df命令.du命令.fsck命令和dump2fs命令: (1)文件系统查看 ...

  5. JavaScript——AJAX

    AJAX技术是网页构建的必备技能之一,本文希望能帮助大家轻松的学习这项技术 一.什么是ajax? ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页. 二.如何使 ...

  6. NOIP2018滚粗记

    NOIP2018滚粗记 day 0 上午,说是可以休息,然后睡到快9点起来吃个早饭去了机房.刷了几个板子就十二点了 下午大概就是看别人总结,颓知乎,完全没心思写代码. 晚上不要求,然后在寝室颓了一下, ...

  7. GitHub && GitLab

    1.github介绍 Git作为一个开源的分布式版本控制系统,已经被越来越多的人使用,随之需要的就是需要有个专门的地方存储.管理通过Git上传的项目,这就是gitHub gitHub是一个面向开源及私 ...

  8. BZOJ5178[Jsoi2011]棒棒糖——主席树

    题目描述 Coffee的世界里也是有棒棒糖卖的,Coffee买了N(1≤N≤50000)只连着的.这N只棒棒糖包裹在小塑料袋中,排成 一列,相邻的两只棒棒糖的塑料袋是接起来的.为了方便,我们把棒棒糖从 ...

  9. BZOJ2124 等差子序列(树状数组+哈希)

    容易想到一种暴力的做法:枚举中间的位置,设该位置权值为x,如果其两边存在权值关于x对称即合法. 问题是如何快速寻找这个东西是否存在.考虑仅将该位置左边出现的权值标1.那么若在值域上若关于x对称的两权值 ...

  10. (转)poj算法做题顺序

    初期: 一.基本算法: (1)枚举. (poj1753,poj2965) (2)贪心(poj1328,poj2109,poj2586) (3)递归和分治法. (4)递推. (5)构造法.(poj329 ...