码迷,mamicode.com
首页 > 编程语言 > 详细

HTML5 History对象,Javascript修改地址栏而不刷新页面(二)

时间:2016-09-10 13:07:25      阅读:177      评论:0      收藏:0      [点我收藏+]

标签:

一、实例说明:

$(‘#btnOne‘).click(function () {
    var stateObject = { id: 1 };
    var title = "本地首页";
    var newUrl = ‘/index.html‘;
    //修改地址栏中的地址
    /*
    * 使用说明,pushState中缓存的地址,必须是当前域中的地址
    */
    history.pushState(stateObject, title, newUrl);
});
$(‘#btnTwo‘).click(function () {
    //获取操作历史记录
    console.info(history.length);
});
window.addEventListener(‘popstate‘, function (event) {
    console.info(event);
    console.info(event.state);
    /*
    * event.state.id 获取说明,第一次打开页面没有id,会抛出异常
    */
    console.info(event.state.id);
});

测试结果:IE10及以上浏览器支持,Google,FF支持

HTML5 History 一:http://www.cnblogs.com/tianma3798/p/5584541.html

HTML5 History对象,Javascript修改地址栏而不刷新页面(二)

标签:

原文地址:http://www.cnblogs.com/tianma3798/p/5859108.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!