ajax后退解决方案(四)
来源:互联网 发布:java 工程根目录 编辑:程序博客网 时间:2024/06/06 00:24
三、通过修改location.hash产生历史,hashchange事件处理后退
01
<!DOCTYPE html>
02
<
html
>
03
<
head
>
04
<
meta
charset
=
"utf-8"
/>
05
<
title
>0</
title
>
06
</
head
>
07
<
body
>
08
<
input
type
=
"button"
value
=
"加1"
onclick
=
"add()"
/>
09
<
div
id
=
"info"
style
=
"border:red 1px solid;width:200px;padding:10px;"
>0</
div
>
10
</
body
>
11
</
html
>
12
<
script
src
=
"history-0.4.js"
></
script
>
13
<
script
>
14
var info = document.getElementById('info');
15
var i = 1;
16
function add() {
17
var data = {
18
param : i,
19
func : func
20
};
21
History.push(data);
22
i++;
23
}
24
25
History.push({param:0, func: func});
26
27
function func(i) {
28
info.innerHTML = i;
29
document.title = i;
30
}
31
</
script
>
每次ajax操作去改变location.hash的值,每次修改后地址栏均会有所体现。在window.onhashchange中监听该事件。通过hash的值取对应的历史。
较iframe的好处是可以复制地址栏的url直接进入该历史记录,缺点是IE6/7不支持。
history-0.4.js
相关:
http://msdn.microsoft.com/en-us/library/cc288209(v=vs.85).aspx
https://developer.mozilla.org/en/DOM/window.onhashchange
http://www.whatwg.org/specs/web-apps/current-work/multipage/history.html#event-hashchange
分类: ajax/sjax
- ajax后退解决方案(四)
- ajax后退解决方案(一)
- ajax后退解决方案(二)
- ajax后退解决方案(三)
- ajax后退解决方案(五)
- Ajax浏览器后退处理
- AJAX页面浏览器前进后退按钮失效和地址书签的解决方案
- AJAX不再是“搜索引擎杀手”(后退的实现)
- struts--防止浏览器后退(解决方案)
- AJAX的产进后退
- AJAX的产进后退
- AJAX 前进后退刷新问题
- 封杀IE,Ajax后退功能
- JAX-RS开发(四):ajax跨域访问REST服务时的cors解决方案
- Ajax读书笔记(四)
- ionic后退造成的闪退解决方案
- 让浏览器记住ajax请求并能前进和后退方法(一)
- 让浏览器记住ajax请求并能前进和后退方法(一)
- 关于 sessionState mode='InProc' 不用启动ASP.NET 服务
- 图片
- YUV pixel formats
- 3D切换界面效果代码分享
- android解析jasonarray遇到的问题
- ajax后退解决方案(四)
- 说说 Windows 中的中文字体
- 库的路径和环境变量文件说明
- 软件工程
- ajax后退解决方案(五)
- VB.NET中的类之间的调用
- Tokyo Cabinet及Tokyo Tyrant tcb tch比较分析
- Java基础19天--02--IO流
- HTLM5 颜色渐变效果