js下利用userData实现客户端保存表单数据
对于多数网页制作的朋友，实现在客户端保存在网页表单上的信息，比较多的是采用Cookie技术来实现，这些功能例如：下拉列表框选择的选项，文本框输入的数据等。
事实上，我们可以利用微软DHTML默认行为中的userData行为来实现这个功能。
因为很多网友问到这样的问题，整理了一下，并提供了三个示例。下面将就该行为的使用做一个介绍：
UserData 行为（userData Behavior）：
1、说明：
userData行为通过将数据写入一个UserData存储区（UserData store）来保存数据，userData可以将数据以XML格式保存在客户端计算机上，如果你用的是 Windows 2000 或者 Windows XP，是保存在C:\Documents and Settings\Liming\UserData\文件夹下（如果操作系统不是安装在C盘，那么C就应该是操作系统所在的分区）。
该数据将一直存在，除非你人为删除或者用脚本设置了该数据的失效期。
userData行为提供了一个比Cookie更具有动态性和更大容量的数据结构。每页的UserData存储区数据大小可以达到64 Kb，每个域名可以达到640 Kb。
userData行为通过sessions为每个对象分配UserData存储区。使用save和load方法将UserData存储区数据保存在缓存（cache）中。一旦UserData存储区保存以后，即使IE浏览器关闭或者刷新了，下一次进入该页面，数据也能够重新载入而不会丢失。
出于安全的考虑，相同协议使用同一个文件夹保存UserData存储区数据。
For security reasons, a UserData store is available only in the same directory and with the same protocol used to persist the store.
在HTML、HEAD、TITLE和STYLE标记上应用了userData行为后使用save和load方法将会出错。
Setting the userData behavior (proposed) class on the HTML, HEAD, TITLE, or STYLE object causes an error when the save or load method is called.
必须在行内或者文档的HEAD部分宣告如下样式：
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>
userData行为可用于Microsoft? Win32?和Unix平台上的IE 5.0以上版本，不支持Netscape。
2、语法：
HTML <ELEMENT STYLE="behavior:url('#default#userData')" ID=sID>
Script object.style.behavior = "url('#default#userData')"
object.addBehavior ("#default#userData")
注：sID参数是一个可以描述该标记的唯一id。ID是可选的，但如果有，可以在脚本中方便地对该标记加以控制。
3、成员：
expires
设置或取得使用userData行为保存数据的失效日期。
脚本语法：对象ID.expires = 参数
参数是一个使用UTC（Universal Time Coordinate，世界调整时间）格式表示失效日期的字符串。该属性可以读写，没有默认值。浏览器会对比这个日期和当前日期，如果到期，该数据就自动失效。
getAttribute()
取得指定的属性值。
load(存储区名)
从UserData存储区载入存储的对象数据。
removeAttribute()
从对象中删除指定的属性值。
save(存储区名)
将对象数据存入一个UserData存储区。
setAttribute()
设置指定的属性值。
XMLDocument
取得存储该对象数据的XML DOM引用。
具体用法可以查看MSDN（http://msdn.microsoft.com）
4、示例
示例一：文本框标记的应用（Microsoft）
代码如下：
<HTML>
<HEAD>
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>
<SCRIPT>
function fnSaveInput(){
var oPersist=oPersistForm.oPersistInput;
oPersist.setAttribute("sPersist",oPersist.value); //将oPersist.value存储为sPersist属性
oPersist.save("oXMLBranch"); //存储在名为oXMLBranch的UserData存储区
}
function fnLoadInput(){
var oPersist=oPersistForm.oPersistInput;
oPersist.load("oXMLBranch"); //载入在名为oXMLBranch的UserData存储区
oPersist.value=oPersist.getAttribute("sPersist"); //将sPersist属性赋值给oPersist.value
}
</SCRIPT>
</HEAD>
<BODY>
<FORM ID="oPersistForm">
<INPUT CLASS="userData" TYPE="text" ID="oPersistInput">
<INPUT TYPE="button" VALUE="Load" onclick="fnLoadInput()">
<INPUT TYPE="button" VALUE="Save" onclick="fnSaveInput()">
</FORM>
</BODY>
</HTML>
示例二：Checkbox标记的应用
代码如下：
<style>
.userData {behavior:url(#default#userdata);}
</style>
<input type=checkbox id=chkbox1 class=userData>
<script>
var obj=document.all.chkbox1;
obj.attachEvent('onclick',saveChecked)
function saveChecked(){
obj.setAttribute("bCheckedValue",obj.checked);
obj.save("oChkValue");
}
window.attachEvent('onload',loadChecked)
function loadChecked(){
obj.load("oChkValue");
var chk=(obj.getAttribute("bCheckedValue")=="true")?true:false;
obj.checked=chk;
}
</script>
示例三：Select标记的应用
代码如下：
<style>
.userData {behavior:url(#default#userdata);}
</style>
<select id="select1" class="userData">
<option>option1</option>
<option>option2</option>
<option>option3</option>
<option>option4</option>
</select>
<script>
var obj=document.all.select1;
obj.attachEvent('onchange',saveSelectedIndex)
function saveSelectedIndex(){
obj.setAttribute("sSelectValue",obj.selectedIndex);
obj.save("oSltIndex");
}
window.attachEvent('onload',loadSelectedIndex)
function loadSelectedIndex(){
obj.load("oSltIndex");
obj.selectedIndex=obj.getAttribute("sSelectValue");
}
</script>
js下利用userData实现客户端保存表单数据的更多相关文章
- 利用userData实现客户端保存表单数据
对于多数网页制作的朋友,实现在客户端保存在网页表单上的信息,比较多的是采用Cookie技术来实现,这些功能例如:下拉列表框选择的选项,文本框输入的数据等.事实上,我们可以利用微软DHTML默认行为中的 ...
- 利用BeanUtils工具类封装表单数据
一.BeanUtils工具类的使用 1.首先导入BeanUtils工具类的jar包 commons-beanutils-1.8.0.jar commons-logging-1.1.1.jar 2.se ...
- 【ASP.NET Web API教程】5.2 发送HTML表单数据：URL编码的表单数据
原文:[ASP.NET Web API教程]5.2 发送HTML表单数据:URL编码的表单数据 注:本文是[ASP.NET Web API系列教程]的一部分,如果您是第一次看本系列教程,请先看前面的内 ...
- 如何利用WordPress创建自定义注册表单插件
来源:http://www.ido321.com/1031.html 原文:Creating a Custom WordPress Registration Form Plugin 译文:创建一个定制 ...
- 如何使用PHP验证客户端提交的表单数据
PHP 表单验证 本章节我们将介绍如何使用PHP验证客户端提交的表单数据. PHP 表单验证 在处理PHP表单时我们需要考虑安全性. 本章节我们将展示PHP表单数据安全处理,为了防止黑客及垃圾信息我们 ...
- js动态的往表格中加入表单元素
效果如图: 这里我用的是layui的静态表格,其他框架也是一样的(只要你都表单元素要通过js进行渲染),我的需求是在表单中放了表格的元素,表格中还有表单的元素.表格中的行数据是js动态添加的,正常的添 ...
- web自己主动保存表单
note:当中部分源代码来源网络 所用的框架:jquery 实现的功能: 1.自己主动保存表单 2.页面刷新的时候把自己主动保存的值赋值给表单元素 思路: 1.表单值改变的时候自己主动触发函数.保存表 ...
- PHP利用超级全局变量$_POST来接收表单数据。
利用$_POST超级全局变量接收表单的数据,然后利用echo输出到页面. 下面是代码: <!doctype html> <html> <head> <titl ...
- C# Winform利用POST传值方式模拟表单提交数据(Winform与网页交互)
其原理是,利用winfrom模拟表单提交数据.将要提交的參数提交给网页,网页运行代码.得到数据.然后Winform程序将网页的全部源码读取下来.这样就达到windows应用程序和web应用程序之间传參 ...
随机推荐
- JavaScript常用类库推荐
Axios Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中 [中文说明], [Github], [教程] Lodash 一致性.模块化.高性能的 Jav ...
- Java原子类--AtomicReference
转载请注明出处:http://www.cnblogs.com/skywang12345/p/3514623.html AtomicReference介绍和函数列表 AtomicReference是作用 ...
- [51Nod 1244] - 莫比乌斯函数之和 & [51Nod 1239] - 欧拉函数之和 (杜教筛板题)
[51Nod 1244] - 莫比乌斯函数之和 求∑i=1Nμ(i)\sum_{i=1}^Nμ(i)∑i=1Nμ(i) 开推 ∑d∣nμ(d)=[n==1]\sum_{d|n}\mu(d)=[n== ...
- 智能灯控（基于ZigBee）
时间:2017年12月 阶段:大二上学期 背景:单片机原理与应用课设 名称:智能灯控 摘要 本系统实现了多方式控灯功能,有按键控灯.串口指令控灯.点对点无线射频控灯.AI模式控灯.其中AI模式控灯是通 ...
- php面向对象之静态方法使用
什么是静态方法? 不是所有的变量和方法都要通过创建对象来调用.可以通过给变量和方法加上static关键字来直接调用.无锡大理石测量平台 调用静态成员的语法格式为: 关键字::静态成员 关键字可以是: ...
- RSA公钥私钥原理及作用
RSA算法广泛应用与加密与认证两个领域 1.加密(保证数据安全性) 使用公钥加密,需使用私钥解密. 这种广泛应用在保证数据的安全性的方面,用户将自己的公钥广播出去,所有人给该用户发数据时使用该公钥加密 ...
- 关于item的prevvalue
一个数据库大小监控项的更新周期是86400.一天,使用的最新值减去上次数值来显示变化值,一直就是10g-0 变化值为10g. 在更新时间为一天的时候prevvalue是0,不能显示上次的数值 当吧更新 ...
- ROS文件系统级
ROS的安装就不介绍了,官方教程是最好的:点击打开链接 ROS是机器人操作系统,它应该有自己的工程结构,Linux系统的文件系统如下: 而ROS的文件系统级如下: 接下来逐一介绍它们: 1. catk ...
- linux经常用的命令
常用 安装包 centos yum / Ubuntu Debian apt-get clear :清空终端 [cmd 下是cls] vi/vim 编辑器 详情 ...
- Intellij IDEA常用操作
1.DEBUG过程中查看指定表达式的值(alt+左键) 2.DEBUG过程中查看指定表达式的值的另一个方法(ctrl+u) 这个快捷键会弹出一个对话框,直接按回车的话显示选中表达式的值,还能在输入框中 ...