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

 更新时间:2010年06月19日 12:46:28   作者:  
对于多数网页制作的朋友,实现在客户端保存在网页表单上的信息,比较多的是采用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)

代码如下:


[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

示例二:Checkbox标记的应用

代码如下:


[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

示例三:Select标记的应用

代码如下:


[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]

相关文章

  • js对象合并与数组合并综合应用举例

    js对象合并与数组合并综合应用举例

    这篇文章主要给大家介绍了关于js对象合并与数组合并综合应用举例的相关资料,本文将介绍常见的JS对象合并和数组合并方法,帮助读者更好地理解和运用这些方法,需要的朋友可以参考下
    2023-11-11
  • javascript if条件判断方法小结

    javascript if条件判断方法小结

    今天在为网站增加一些代码功能的时候,需要用到if条件判断,发现简写方法忘了,这里特整理下
    2014-05-05
  • JavaScript使用concat连接数组的方法

    JavaScript使用concat连接数组的方法

    这篇文章主要介绍了JavaScript使用concat连接数组的方法,实例分析了javascript中concat函数操作数组的技巧,需要的朋友可以参考下
    2015-04-04
  • 微信小程序如何再次获取用户授权的方法

    微信小程序如何再次获取用户授权的方法

    这篇文章主要介绍了微信小程序如何再次获取用户授权的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-05-05
  • JavaScript使用encodeURI()和decodeURI()获取字符串值的方法

    JavaScript使用encodeURI()和decodeURI()获取字符串值的方法

    这篇文章主要介绍了JavaScript使用encodeURI()和decodeURI()获取字符串值的方法,实例分析了encodeURI()和decodeURI()函数解析字符串的相关技巧,需要的朋友可以参考下
    2015-08-08
  • js html5 css俄罗斯方块游戏再现

    js html5 css俄罗斯方块游戏再现

    这篇文章主要为大家详细介绍了js html5 css俄罗斯方块游戏实现代码,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-10-10
  • 用JS生成UUID的方法实例

    用JS生成UUID的方法实例

    下面小编就为大家带来一篇用JS生成UUID的方法实例。小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-03-03
  • 一文帮你理解PReact10.5.13源码

    一文帮你理解PReact10.5.13源码

    这篇文章主要介绍了一文帮你理解PReact10.5.13源码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-04-04
  • Js动态创建div

    Js动态创建div

    因为功能需要,需要动态创建DIV
    2008-09-09
  • JS+CSS实现淡入式焦点图片幻灯切换效果的方法

    JS+CSS实现淡入式焦点图片幻灯切换效果的方法

    这篇文章主要介绍了JS+CSS实现淡入式焦点图片幻灯切换效果的方法,实例分析了javascript操作图片、css等元素实现幻灯片的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-02-02

最新评论