对于多数网页制作的朋友,实现在客户端保存在网页表单上的信息,比较多的是采用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>

利用userData实现客户端保存表单数据的更多相关文章

  1. js下利用userData实现客户端保存表单数据

    对于多数网页制作的朋友,实现在客户端保存在网页表单上的信息,比较多的是采用Cookie技术来实现,这些功能例如:下拉列表框选择的选项,文本框输入的数据等. 事实上,我们可以利用微软DHTML默认行为中 ...

  2. 利用BeanUtils工具类封装表单数据

    一.BeanUtils工具类的使用 1.首先导入BeanUtils工具类的jar包 commons-beanutils-1.8.0.jar commons-logging-1.1.1.jar 2.se ...

  3. 如何使用PHP验证客户端提交的表单数据

    PHP 表单验证 本章节我们将介绍如何使用PHP验证客户端提交的表单数据. PHP 表单验证 在处理PHP表单时我们需要考虑安全性. 本章节我们将展示PHP表单数据安全处理,为了防止黑客及垃圾信息我们 ...

  4. PHP利用超级全局变量$_POST来接收表单数据。

    利用$_POST超级全局变量接收表单的数据,然后利用echo输出到页面. 下面是代码: <!doctype html> <html> <head> <titl ...

  5. C# Winform利用POST传值方式模拟表单提交数据(Winform与网页交互)

    其原理是,利用winfrom模拟表单提交数据.将要提交的參数提交给网页,网页运行代码.得到数据.然后Winform程序将网页的全部源码读取下来.这样就达到windows应用程序和web应用程序之间传參 ...

  6. 利用jquery进行ajax提交表单和附带的数据

    1.获取表单数据: $form.serialize() 2.附带数据:input[status]=1 3.构造url链接:url = $form.attr('action') + '?input[st ...

  7. 如何利用WordPress创建自定义注册表单插件

    来源:http://www.ido321.com/1031.html 原文:Creating a Custom WordPress Registration Form Plugin 译文:创建一个定制 ...

  8. 如何发送HTML表单数据

    多数时候,HTML表单的目的只是为了把数据发给服务器,之后服务器再处理这些数据并发送响应给用户.虽然看起来挺简单的,但我们还是得注意一些事情以确保传送的数据不会破坏服务器.或者给你的用户制造麻烦. 数 ...

  9. flask 处理表单数据

    处理表单数据 表单数据的处理涉及很多内容,从获取数据到保存数据大致有以下步骤: 1.  解析请求,获取表单数据 2.  对数据进行必要的转换,比如讲勾选框的值转换成python的布尔值 3.  验证数 ...

随机推荐

  1. C#时间间隔

    System.Diagnostics.Stopwatch stopwatch = new System.Diagnostics.Stopwatch(); stopwatch.Start(); stop ...

  2. Flutter - 创建侧滑菜单

    侧滑菜单在安卓App里面非常常见,比如Gmail,Google Play,Twitter等.看下图 网上也有很多创建侧滑菜单的教程,我也来记录一下,自己学习创建Drawer的过程. 1. 创建一个空的 ...

  3. js 日期,时间函数 及相关运算大全

    一.在js中如何比较两个时间字符串的大小 方法一: function CompareDate(d1,d2){     return ((new Date(d1.replace(/-/g,"/ ...

  4. spring cloud网关通过Zuul RateLimit 限流配置

    目录 引入依赖 配置信息 RateLimit源码简单分析 RateLimit详细的配置信息解读 在平常项目中为了防止一些没有token访问的API被大量无限的调用,需要对一些服务进行API限流.就好比 ...

  5. C++模板的实现(模板函数和模板类,附带模板实现顺序表和链表代码)

    文章链接:https://blog.csdn.net/qq_38646470/article/details/80209469

  6. 通过Task异步加快对数组的运算

    一.介绍 Task是.NetFramework3.0出现的,线程是基于线程池,然后提供了丰富的API. 先用AverageAssign方法把一组数据平均分成n组,再通过遍历n组数据,循环开Task多线 ...

  7. python图像处理(2)图像水印和PIL模式转化

    模式转化: PIL模式转化:将图片转化成其他模式 # 我们将image图像转化为灰度图像(python) from PIL import Image img = Image.open('c:\\1.J ...

  8. Python构建web应用(进阶版)->对网页HTML优化逻辑显示

    本篇是承接上一篇web应用(入门级)的内容往下顺延的,阅读后将会了解HTML逻辑显示优化,如下图所示,从杂乱无章的日志文件到一个整齐的列表显示. —————————————————————————— ...

  9. vim文本编辑工具(全)

    VIM文本编辑工具 编辑模式 i    在当前字符前插入I   在光标所在的行首插入a 在当前字符后插入A 在光标所在行尾插入o 在当前行的下一行插入新的一行O 在当前行的上一行插入新的一行 s   ...

  10. C程序员必读的 3 本书

    C程序员必读的 3 本书 原创: Martin 老师  公众号:零基础零障碍学习C语言 勿用质疑,今天来看这篇文章的朋友都是准备学好C语言的朋友,大家想学好C语言的迫切性,就好比Martin老师等着元 ...