细节致上之(浏览器后退操作时,表单状态的还原)

从事这行当多年,对于表单提交后失败返回保留先前表单中的信息这点小需求,一直不当回事。给这事折磨过自已几回去,才拿出来当回事。
下面来讲讲浏览器默认下,表单回退时的现象:

除过Firefox以为,其余浏览器都会保存表单的状态:
Firefox加 以后也保存状态成功
Cache-Control取值有如下几个:public,private,no-cache,no-store,no-transform,must-revalidate,proxy-revalidate,max-age
Cache-Control属于http1.1范畴,主流浏览器都支持http1.1,但是貌似只有Firefox遵守“Cache-Control”。

如果想保留表单状态,基本就可以.

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

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

在回退和前进时:
Cache-Control为no-store时:
firefox: 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……(如果想重置表单的话)

—————-
以上技术引述网络,本人边理解边抄。哈~~

相关日志

发表于:2009-09-26 20:37:28 at 20:37 分类:代码 发表评论 Tags:, ,

发表评论

(必填)

(必填)您的电子邮箱不会被公开。

*

正在加载信息...

Archives