存储FORM数据在客户端(持久化客户端HTML中的FORM数据）

最新推荐文章于 2025-10-11 20:45:28 发布

最新推荐文章于 2025-10-11 20:45:28 发布 · 306 阅读

文章标签：

#HTML #JavaScript #Web #ViewUI

本文介绍了一种基于HTML页面的离线数据采集方法，利用saveSnapshot行为保存网页表单数据，便于用户在离线状态下使用。该方法适用于广泛的日常活动，无需特殊脚本处理即可直接在页面中保存表单数据。

近一段时间要研究离线编码，然后上传至服务器端保存数据的方法，几年前就看到客户端的页面也能保存数据，想做一做这样的尝试，实现基于网页的客户端离线数据采集的方法，实现的方法其实挺简单。

第一：做一个通用的HTML页面，用FORM保存页面数据

第二：提交这个离线的HTML页面到服务端

第三：POST离线采集的数据

实现基于网页的离线数据采集

MSDN中的描述如下：

Persisting Form Data

Using HTML to design forms comes with some drawbacks, namely the need for a server or client-side script to process the form data. The saveSnapshot behavior can be used to save a Web page and persist the form data directly within the page itself. This allows a larger audience to use Web forms for day-to-day activities without needing a special script to process and deliver the information.

主要用到的就是saveSnapshot，代码如下：

<HTML><HEAD>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<META content=snapshot name=save>
<STYLE>.saveSnapshot {
BEHAVIOR: url(#default#savesnapshot)
}
</STYLE>

<META content="MSHTML 6.00.6000.16608" name=GENERATOR></HEAD>
<BODY>
<FORM class=saveSnapshot id=oPersistForm>First Name: <INPUT> Last Name: <INPUT>
Exemptions: <INPUT> </FORM>
<OBJECT id=ObjWB height=0 width=0
classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2></OBJECT><A
onclick=document.all.ObjWB.ExecWB(4,1); href="javascript:void(0);">Save As
</A></BODY></HTML>

标红部分是需要注意的

当用户在填完表单内容的时候，点击Save As，保存成网页，当你下次打开网页时，就可以看到数据已经存在页面上了，实现了离线的数据采集功能，自我感觉挺好使的，呵呵

详细内容可以到MSDN的帮助上看看：ms-help://MS.VSCC.v80/MS.MSDN.v80/MS.WEBDEV.v10.en/behavior/workshop/author/persistence/howto/formdata.htm

但在安全性方面得有一些考虑，MSDN上面对此也提出了见意。