浏览器前进后退时表单状态的保持

先说一下各浏览器默认下,表单回退时的现象:

除过ff以为,其余浏览器都会保存表单的状态,
ff加<meta  http-equiv="Cache-Control"   CONTENT="private,must-revalidate">   以后也保存状态成功

Cache-Control取值有如下几个:public,private,no-cache,no-store,no-transform,must-revalidate,proxy-revalidate,max-age

Cache-Control属于http1.1范畴,主流浏览器都支持http1.1,但是貌似只有FF遵守"Cache-Control".

如果想保留表单状态,基本<meta  http-equiv="Cache-Control"   CONTENT="private,must-revalidate">就可以.

如果想重置表单,射雕兄写过一个方法如下:
   1. Safari 和 Opera 是两个极端，一个完全还原，一个完全保留。
   2. Firefox 下最简单的办法是设置 autocomplete = ‘off’ 属性。(ff2下无效)
   3. IE 必须在 setTimeout 中还原表单值才有效。
   4. Chrome 除了不支持 onpageshow, 其它表现和 Firefox 一致。


各浏览器响应Cache-Control如下:

在回退和前进时:
Cache-Control为no-store时:
FF: onload,DOMContentLoaded,页面执行代码和onpageshow都会被调用,否则只调用onpageshow(页面状态会被完美保留,类似于safari)
一种例外情况就是添加unload,有unload事件时,不管Cache-Control为何值,onload,DOMContentLoaded,页面执行代码和onpageshow都调用.

IE有没有no-store,onload都会被调用.没有onpageshow事件.
表单状态保留

chrome和IE一样.

safari:无论Cache-Control为何值,都不会触发任何onload,DOMContentLoaded,页面执行代码,(有一种例外情况,当有unload事件时,onload,DOMContentLoaded,页面执行代码都会执行)

另外,safari虽然不触发 onload,DOMContentLoaded,页面执行代码.但是页面当前状态会被完美保留(就像在两个标签页之间切换一样自然)
表单状态保留

opera:
opera和其他浏览器不同之处,每次在地址栏敲回车都算一次跳转,虽然url没变,但是历史记录却有了(刷新没事)...
Cache-Control 无论为何值,都不会触发onload,DOMContentLoaded,页面执行代码...window.onfoucs不执行
引用射雕兄的话:忘掉opera......(如果想重置表单的话)

补充本人所用浏览器:   IE7,   FF3.5.1,   safari4.0.2,   opera10 beta,     chrome2



网名:天堂左我往右

评论

2 楼 lixinlixin2008 2009-07-26  

在前进后退时页面状态能完美保持俺觉得对用户体验会很好
比如访问google maps,当拖拽到北京时,回退和前进时,地图依然能保持在北京

不过在IE和Chrome下根本无法实现...

1 楼 zhouyrt 2009-07-23  

总结的很细致，不过没有一一测试。