userData를 사용하여 js_javascript 기술로 클라이언트 측에 양식 데이터 저장

실제로 Microsoft DHTML 기본 동작의 userData 동작을 사용하여 이 기능을 구현할 수 있습니다.

많은 네티즌들이 이 질문을 해주셔서 정리해서 3가지 예를 들어봤습니다. 다음은 이 동작의 사용에 대한 소개입니다.

UserData 동작(userData Behavior):

1. 설명:
userData 동작은 데이터 A를 씁니다. UserData 저장소는 데이터를 클라이언트 컴퓨터에 XML 형식으로 저장할 수 있습니다. Windows 2000 또는 Windows XP를 사용하는 경우 C:Documents 및 SettingsLimingUserData 폴더에 저장됩니다(C에 운영 체제가 설치되어 있지 않은 경우). 드라이브이면 C는 운영 체제가 있는 파티션이어야 합니다).

이 데이터는 수동으로 삭제하거나 스크립트로 데이터의 만료 날짜를 설정하지 않는 한 항상 존재합니다.

userData 동작은 쿠키보다 더 동적이고 대용량의 데이터 구조를 제공합니다. 페이지당 UserData 저장 영역의 데이터 크기는 64Kb에 달할 수 있으며, 각 도메인 이름은 640Kb에 달할 수 있습니다.
userData 동작은 세션을 통해 각 객체에 UserData 저장소를 할당합니다. 캐시에 UserData 저장 영역 데이터를 저장하려면 save 및 load 메소드를 사용하십시오. UserData 저장 영역이 저장되면 IE 브라우저를 닫거나 새로 고치더라도 다음 페이지에 들어갈 때 데이터가 손실 없이 다시 로드될 수 있습니다.
보안상의 이유로 동일한 프로토콜은 동일한 폴더를 사용하여 UserData 저장 영역 데이터를 저장합니다.
보안상의 이유로 UserData 저장소는 저장소를 유지하는 데 사용되는 동일한 디렉터리 및 동일한 프로토콜에서만 사용할 수 있습니다.

HTML, HEAD, TITLE 및 STYLE 태그에 userData 동작을 적용한 후에 사용됩니다. 로드 방법에 오류가 발생합니다.
HTML, HEAD, TITLE 또는 STYLE 객체에 userData 동작(제안) 클래스를 설정하면 저장 또는 로드 메소드가 호출될 때 오류가 발생합니다.

인라인 또는 의 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 동작을 사용하여 저장된 데이터의 만료 날짜를 설정하거나 가져옵니다.
스크립트 구문: Object ID.expires = 매개변수
매개변수는 UTC(Universal Time Coordinate, World Adjustment Time) 형식으로 만료 날짜를 나타내는 문자열입니다. 이 속성은 읽고 쓸 수 있으며 기본값이 없습니다. 브라우저는 이 날짜를 현재 날짜와 비교하여 만료되면 데이터가 자동으로 만료됩니다.

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 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다. ]

예시 2: Checkbox 태그

의 적용 코드는 다음과 같습니다.

<style> .userData {behavior:url(#default#userdata);} </style> <input type="checkbox" id="chkbox1" class="userData">
[Ctrl A 모두 선택 참고: 외부 J를 도입해야 하는 경우 실행하려면 새로 고쳐야 합니다

]<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需刷新才能执行]