KoXo 자바스크립트 - 비헤비어(behavior) - saveSnapshot (A, ACRONYM, ADDRESS, ...)

웹페이지가 저장될 때 개체의 유지(persist) 데이터를 가능하게한다.

	script	object.style.behavior="url('#default#saveSnapshot')";
object.addBehavior("#default#saveSnapshot");
HTML	<ELEMENT style="behavior:url('#default#saveSnapshot')" id=idVal>
XML	<prefix:CustomTag id=idVal style="behavior:url('#default#saveSnapshot')" />

script

object.style.behavior="url('#default#saveSnapshot')";

object.addBehavior("#default#saveSnapshot");

HTML

XML

<prefix:CustomTag id=idVal style="behavior:url('#default#saveSnapshot')" />

이벤트	설명
onsave	웹페이지가 저장되거나 북마크에 등록될 때, 혹은 사용자가 문서로부터 이탈했을 때, 유지(persist) 엘레멘트로 부터 발생된다.

이벤트

설명

onsave

웹페이지가 저장되거나 북마크에 등록될 때, 혹은 사용자가 문서로부터 이탈했을 때, 유지(persist) 엘레멘트로 부터 발생된다.

개체	IE
<ELEMENT style="behavior:url('#default#saveSnapshot')" id=idVal>	IE5(win32,unix)
A ACRONYM ADDRESS AREA B BIG BLOCKQUOTE BUTTON CENTER CITE CODE DD DEL DFN DIR DIV DL DT EM FONT FORM hn HR I IMG INPUT type=button INPUT type=checkbox INPUT type=file INPUT type=hidden INPUT type=image INPUT type=password INPUT type=radio INPUT type=reset INPUT type=submit INPUT type=text KBD LABEL LI LISTING MAP MARQUEE MENU OBJECT OL P plainText PRE Q S SAMP SCRIPT SELECT SMALL SPAN STRIKE STRONG SUB SUP TABLE TEXTAREA TT U UL VAR XMP

개체

IE5(win32,unix)

A ACRONYM ADDRESS AREA B BIG BLOCKQUOTE BUTTON CENTER CITE CODE DD DEL DFN DIR DIV DL DT EM FONT FORM hn HR I IMG INPUT type=button INPUT type=checkbox INPUT type=file INPUT type=hidden INPUT type=image INPUT type=password INPUT type=radio INPUT type=reset INPUT type=submit INPUT type=text KBD LABEL LI LISTING MAP MARQUEE MENU OBJECT OL P plainText PRE Q S SAMP SCRIPT SELECT SMALL SPAN STRIKE STRONG SUB SUP TABLE TEXTAREA TT U UL VAR XMP

결과 표시창

saveSnapshot 비헤이버로 저장 후 읽어보라.
데이터를 class=SnapshotClass으로 설정된 form 엘레멘트들로 부터 snapShotData에 저장한다.

<HTML>
<HEAD>
<META name="save" content="snapshot">
<STYLE>.SnapshotClass {behavior:url(#default#saveSnapshot);}</STYLE>
<SCRIPT class="SnapshotClass" id=oPersistScript>
var snapShotData=str=allPersistData='';
function StorePersist(){
  var str=snapShotData='';
  for(var i=0;i< formName.elements.length;i++){
    if (formName.elements[i].type=='text'){
      snapShotData+=formName.elements[i].value+'|';
    }
    if (formName.elements[i].tagName=='SELECT'){
      snapShotData+='dataType='+formName.elements[i].options[formName.elements[i].selectedIndex].innerText;
      formName.selName.selected=-1;
    }
  }
  allPersistData=snapShotData;
  str+='저장 : snapShotData=<FONT color=blue>'+snapShotData+'</FONT><BR>';
  showA.innerHTML=str;
}
function RestorePersist(){
  str='';
  if (allPersistData){
    collData=allPersistData.split('|');
    for(var i=0;i< collData.length;i++){
      if (collData[i].indexOf('dataType=')==-1) formName.elements[i].value=collData[i];
      else if (collData[i].indexOf('dataType=')>=0){
        formName.selName.selectedIndex=collData[i].substring(collData[i].indexOf('=')+1,collData[i].length);
        str+='allPersistData=<FONT color=blue>'+allPersistData+'</FONT><BR>';
        str+='collData=<FONT color=blue>'+collData+'</FONT><BR>';
        for (k=0;k< collData.length;k++){
          str+='<SPAN style="width:2em"></SPAN>collData['+k+']=<FONT color=blue>'+collData[k]+'</FONT><BR>';
        }
      }
    }
  } else str+='저장된 데이터가 없다.';
  showA.innerHTML=str;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM id="formName">
<TABLE width=500>
<TR><TD><LABEL for="inName">성명=</LABEL></TD>
<TD><INPUT class="SnapshotClass" type="text" id="inName" size=10 value="홍길동"></TD>
<TD><LABEL for="inArea">지역=</LABEL></TD>
<TD><INPUT class="SnapshotClass" type="text" id="inArea" size=15 value="서울 특별시"></TD>
<TD><LABEL for="selName">직업=</LABEL></TD>
<TD>
<SELECT id="selName">
<OPTION>회사원<OPTION>교직원<OPTION>학생<OPTION selected>자영업
</SELECT></TD></TR>
</TABLE>
<INPUT type="button" value="SCRIP의 데이터로부터 저장" onclick="StorePersist()">
<INPUT type="button" value="SCRIP의 데이터로부터 읽기" onclick="RestorePersist()">
</FORM>
<DIV id=showA>결과 표시창</DIV>
</BODY>
</HTML>

prefix	CustomTag과 연관된 XML namespace 접두어이다. HTML 태그에서 xmlns 애트리뷰트로 설정한다.
CustomTag	작성자가 정의하여 사용하는 태그이다.
idVal	개체을 대표하는 유일한 인식자 문자열이다.