작성자 주: 오늘 onchange 이벤트를 사용해봐도 아무런 응답이 없었습니다. 드디어 정보를 확인해보니 Onchange의 한계와 불안정성에 대해 알게 되었습니다. 하지만 onpropertychange는 매우 잘 구현될 수 있으며, 특히 실시간 캡처 성능은 사용할 가치가 있습니다. (이 성능 덕분에 사장님 아주머니는 내가 만든 o(∩_∩)o...에 매우 만족해하십니다.)
저도 꽤 게으르고, 제가 만든 것들을 정리하기에는 너무 게으른 관계로 제가 검색한 정보의 원본 버전만 공유할 수 있습니다:
IE에서는 HTML 요소의 속성이 변경되면 onpropertychange를 통해 캡처할 수 있습니다. 예를 들어
<입력 이름="text1" id="text1" />
페이지의 스크립트에 의해 객체의 value 속성이 수정되면 onchange에서는 캡처할 수 없지만 onpropertychange에서는 캡처할 수 있습니다. (실시간으로 캡처)
즉, onpropertychange는 속성 값의 변경 사항을 적시에 캡처할 수 있으며, 이벤트를 활성화하려면 속성 값이 변경될 때 onchange가 현재 요소의 포커스를 잃도록(onblur) 해야 합니다!
좋다:
예시 1:
이미지 주소를 입력하세요: <input type="text" name="mytext" size="10" value="" onpropertychange="document.images['myimg'].src=this.value;" id ="myimg" src="/img/common/logo.gif" />
텍스트 상자의 내용이 변경되면 즉시 그림이 표시됩니다. 그리고 onchange를 사용하면 해당 값을 변경할 때 빈 공간이나 다른 곳을 마우스로 클릭하여 입력 요소가 초점을 잃게 만드는(onblur) 이벤트가 활성화되고 이미지 표시가 변경됩니다!
예시 2:
<INPUT id="image" style="WIDTH: 448px; HEIGHT: 22px" onpropertychange="preview.src=image.value" type="file" size="55" name="File1" runat="서버">
<IMG id="미리보기" src="">
------------------------------------- ---------------
onpropertychange 이벤트 너무 귀여워서 첫눈에 반했어요
onChange: 현재 요소가 포커스를 잃고 요소의 내용이 변경될 때 트리거되는 이벤트 [마우스와 키보드 모두로 트리거될 수 있음]
따라서 스크립트에 의해 객체의 값이 변경되면 사용자가 마우스나 키보드를 움직이지 않으므로 onChange 이벤트가 발생하지 않습니다.