js_javascript スキルで userData を使用してクライアント側にフォーム データを保存する

実際、Microsoft DHTML のデフォルト動作の userData 動作を使用して、この機能を実現できます。

多くのネチズンがこの質問をしたので、それを整理して3つの例を示しました。以下では、この動作の使用方法について説明します。

UserData 動作 (userData 動作):

1. 説明:
userData 動作はデータ A を書き込みます。 UserData ストアは、データをクライアント コンピュータに XML 形式で保存できます。Windows 2000 または Windows XP を使用している場合は、C:Documents and SettingsLimingUserData フォルダに保存されます (オペレーティング システムが C にインストールされていない場合)。ドライブの場合、C はオペレーティング システムが配置されているパーティションになります)。

このデータは、手動で削除するか、スクリプトでデータの有効期限を設定しない限り、常に存在します。

userData の動作は、Cookie よりも動的で大容量のデータ構造を提供します。 UserData ストレージ領域の 1 ページあたりのデータ サイズは 64 KB、各ドメイン名は 640 KB に達する可能性があります。
userData 動作は、セッションを通じて各オブジェクトに UserData ストレージを割り当てます。 save メソッドとload メソッドを使用して、UserData ストレージ領域のデータをキャッシュに保存します。 UserData の保存領域を保存すると、IE ブラウザを閉じたり更新したりしても、次回ページにアクセスしたときにデータを失うことなく再読み込みできます。
セキュリティ上の理由から、同じプロトコルは同じフォルダーを使用して UserData ストレージ領域のデータを保存します。
セキュリティ上の理由から、UserData ストアは、ストアの永続化に使用されるのと同じディレクトリ内でのみ使用できます。

HTML、HEAD、TITLE、および STYLE タグに userData の動作を適用した後に使用されます。そしてロードメソッドはエラーになります。
HTML、HEAD、TITLE、または STYLE オブジェクトに userData 動作 (提案) クラスを設定すると、save メソッドまたはload メソッドが呼び出されるときにエラーが発生します。

インラインまたは HEAD セクションで宣言する必要があります。ドキュメントは次のようになります。 スタイル:



userData の動作が利用可能Microsoft の場合、Win32 ?Unix プラットフォーム上の IE 5.0 以降では、Netscape はサポートされていません。

2. 構文:
HTML Behavior = "url('#default#userData')"
object.addBehavior ("#default#userData")
注: sID パラメーターは、タグを説明できる一意の ID です。 ID はオプションですが、存在する場合、スクリプトでタグを簡単に制御できます。


3. メンバー:
expires
userData 動作を使用して保存されたデータの有効期限を設定または取得します。
スクリプト構文: オブジェクト ID.expires = パラメーター
パラメーターは、UTC (協定世界時、世界調整時間) 形式で有効期限を表す文字列です。このプロパティは読み取りおよび書き込み可能であり、デフォルト値はありません。ブラウザはこの日付と現在の日付を比較し、有効期限が切れた場合、データは自動的に期限切れになります。

getAttribute()
指定された属性値を取得します。

load (記憶領域名)
UserData 記憶領域から格納されているオブジェクトデータをロードします。

removeAttribute()
指定された属性値をオブジェクトから削除します。

save (ストレージ領域名)
オブジェクトデータを UserData ストレージ領域に保存します。

setAttribute()
指定された属性値を設定します。

XMLDocument
オブジェクト データを格納する XML DOM 参照を取得します。

具体的な使用方法については、MSDN (http://msdn.microsoft.com) をご確認ください
4. 例

例 1: テキスト ボックス マークの適用 (Microsoft)
コードは次のとおりです:

<style> .userData {behavior:url(#default#userdata);} </style> <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>
[Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、更新して実行する必要があります ]

例 2: チェックボックス タグ

のアプリケーション コードは次のとおりです:

<style> .userData {behavior:url(#default#userdata);} </style> <input type="checkbox" id="chkbox1" class="userData">
[Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、

を実行するために更新する必要があります]<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>
示例三：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>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]