js下利用userData實(shí)現(xiàn)客戶端保存表單數(shù)據(jù)
事實(shí)上,我們可以利用微軟DHTML默認(rèn)行為中的userData行為來實(shí)現(xiàn)這個(gè)功能。
因?yàn)楹芏嗑W(wǎng)友問到這樣的問題,整理了一下,并提供了三個(gè)示例。下面將就該行為的使用做一個(gè)介紹:
UserData 行為(userData Behavior):
1、說明:
userData行為通過將數(shù)據(jù)寫入一個(gè)UserData存儲(chǔ)區(qū)(UserData store)來保存數(shù)據(jù),userData可以將數(shù)據(jù)以XML格式保存在客戶端計(jì)算機(jī)上,如果你用的是 Windows 2000 或者 Windows XP,是保存在C:\Documents and Settings\Liming\UserData\文件夾下(如果操作系統(tǒng)不是安裝在C盤,那么C就應(yīng)該是操作系統(tǒng)所在的分區(qū))。
該數(shù)據(jù)將一直存在,除非你人為刪除或者用腳本設(shè)置了該數(shù)據(jù)的失效期。
userData行為提供了一個(gè)比Cookie更具有動(dòng)態(tài)性和更大容量的數(shù)據(jù)結(jié)構(gòu)。每頁的UserData存儲(chǔ)區(qū)數(shù)據(jù)大小可以達(dá)到64 Kb,每個(gè)域名可以達(dá)到640 Kb。
userData行為通過sessions為每個(gè)對(duì)象分配UserData存儲(chǔ)區(qū)。使用save和load方法將UserData存儲(chǔ)區(qū)數(shù)據(jù)保存在緩存(cache)中。一旦UserData存儲(chǔ)區(qū)保存以后,即使IE瀏覽器關(guān)閉或者刷新了,下一次進(jìn)入該頁面,數(shù)據(jù)也能夠重新載入而不會(huì)丟失。
出于安全的考慮,相同協(xié)議使用同一個(gè)文件夾保存UserData存儲(chǔ)區(qū)數(shù)據(jù)。
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標(biāo)記上應(yīng)用了userData行為后使用save和load方法將會(huì)出錯(cuò)。
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.
必須在行內(nèi)或者文檔的HEAD部分宣告如下樣式:
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>
userData行為可用于Microsoft? Win32?和Unix平臺(tái)上的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參數(shù)是一個(gè)可以描述該標(biāo)記的唯一id。ID是可選的,但如果有,可以在腳本中方便地對(duì)該標(biāo)記加以控制。
3、成員:
expires
設(shè)置或取得使用userData行為保存數(shù)據(jù)的失效日期。
腳本語法:對(duì)象ID.expires = 參數(shù)
參數(shù)是一個(gè)使用UTC(Universal Time Coordinate,世界調(diào)整時(shí)間)格式表示失效日期的字符串。該屬性可以讀寫,沒有默認(rèn)值。瀏覽器會(huì)對(duì)比這個(gè)日期和當(dāng)前日期,如果到期,該數(shù)據(jù)就自動(dòng)失效。
getAttribute()
取得指定的屬性值。
load(存儲(chǔ)區(qū)名)
從UserData存儲(chǔ)區(qū)載入存儲(chǔ)的對(duì)象數(shù)據(jù)。
removeAttribute()
從對(duì)象中刪除指定的屬性值。
save(存儲(chǔ)區(qū)名)
將對(duì)象數(shù)據(jù)存入一個(gè)UserData存儲(chǔ)區(qū)。
setAttribute()
設(shè)置指定的屬性值。
XMLDocument
取得存儲(chǔ)該對(duì)象數(shù)據(jù)的XML DOM引用。
具體用法可以查看MSDN(http://msdn.microsoft.com)
4、示例
示例一:文本框標(biāo)記的應(yīng)用(Microsoft)
代碼如下:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
示例二:Checkbox標(biāo)記的應(yīng)用
代碼如下:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
示例三:Select標(biāo)記的應(yīng)用
代碼如下:
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
- 關(guān)于AngularJs數(shù)據(jù)的本地存儲(chǔ)詳解
- js仿微博實(shí)現(xiàn)統(tǒng)計(jì)字符和本地存儲(chǔ)功能
- 純js實(shí)現(xiàn)無限空間大小的本地存儲(chǔ)
- js瀏覽器本地存儲(chǔ)store.js介紹及應(yīng)用
- localStorage的黑科技-js和css緩存機(jī)制
- JavaScript中l(wèi)ocalStorage對(duì)象存儲(chǔ)方式實(shí)例分析
- 移動(dòng)端使用localStorage緩存Js和css文的方法(web開發(fā))
- 詳解JavaScript中l(wèi)ocalStorage使用要點(diǎn)
- Javascript 計(jì)算字符串在localStorage中所占字節(jié)數(shù)
- JS localStorage實(shí)現(xiàn)本地緩存的方法
- JS實(shí)現(xiàn)本地存儲(chǔ)信息的方法(基于localStorage與userData)
相關(guān)文章
PhantomJS快速入門教程(服務(wù)器端的 JavaScript API 的 WebKit)
Phantom JS是一個(gè)服務(wù)器端的 JavaScript API 的 WebKit。其支持各種Web標(biāo)準(zhǔn): DOM 處理, CSS 選擇器, JSON, Canvas, 和 SVG2015-08-08微信小程序城市定位的實(shí)現(xiàn)實(shí)例(獲取當(dāng)前所在國家城市信息)
這篇文章給大家認(rèn)真介紹了微信小程序城市定位的實(shí)現(xiàn)實(shí)例,主要實(shí)現(xiàn)了獲取當(dāng)前所在國家城市信息的相關(guān)資料,文中介紹的非常詳細(xì),相信對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起看看吧。2017-05-05詳解Web使用webpack構(gòu)建前端項(xiàng)目
本篇文章主要介紹了詳解Web使用webpack構(gòu)建前端項(xiàng)目,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-09-09Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果
這篇文章主要介紹了Javascript仿新浪游戲頻道鼠標(biāo)懸停顯示子菜單效果,涉及鼠標(biāo)事件及頁面元素結(jié)點(diǎn)的遍歷技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08Wordpress ThickBox 添加“查看原圖”效果代碼
上一次修改了點(diǎn)擊圖片動(dòng)作 , 這次添加一個(gè)“查看原圖”的鏈接,點(diǎn)擊后將在一個(gè)新瀏覽器窗口(或Tab)打開該圖片的原始鏈接地址。2010-12-12js實(shí)現(xiàn)仿網(wǎng)易點(diǎn)擊彈出提示同時(shí)背景變暗效果
這篇文章主要介紹了js實(shí)現(xiàn)仿網(wǎng)易點(diǎn)擊彈出提示同時(shí)背景變暗效果,涉及javascript彈出框及頁面元素樣式操作的相關(guān)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-08-08JS組件Bootstrap Table表格行拖拽效果實(shí)現(xiàn)代碼
這篇文章分享了JS組件Bootstrap Table表格行拖拽效果實(shí)現(xiàn)代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-12-12