> 웹 프론트엔드 > JS 튜토리얼 > js의 onchange 및 onpropertychange(onchange 잘못된 솔루션)_javascript 기술

js의 onchange 및 onpropertychange(onchange 잘못된 솔루션)_javascript 기술

WBOY
풀어 주다: 2016-05-16 16:56:17
원래의
1417명이 탐색했습니다.

작성자 주: 오늘 온체인지 이벤트를 이용했는데 아무 일도 일어나지 않았습니다. 드디어 정보를 확인해보니 온체인지의 한계와 불안정성에 대해 알게 되었습니다. 하지만 onpropertychange는 매우 잘 구현될 수 있으며, 특히 실시간 캡처 성능은 사용할 가치가 있습니다. (이 성능 덕분에 사장님 아주머니는 내가 만든 o(∩_∩)o...에 매우 만족해하십니다.)

나도 꽤 게으르고, 내가 만든 것들을 정리하기엔 너무 게으른데, 내가 검색한 정보의 원본 버전만 공유할 수 있어요:

IE에서는 HTML 요소의 속성이 변경되면 onpropertychange를 통해 캡처할 수 있습니다. 예를 들어

개체의 값 속성이 페이지의 스크립트에 의해 수정되면 onchange는 캡처할 수 없지만 onpropertychange는 캡처할 수 있습니다. (실시간 캡쳐)

즉, : onpropertychange는 시간에 따른 속성 값의 변경 사항을 캡처할 수 있으며, onchange가 속성에 있는 동안 값이 변경되면 이 이벤트를 활성화하려면 현재 요소가 초점을 잃어야 합니다(onblur)!

예:

예 1:

이미지 주소를 입력하세요:

텍스트 상자의 내용이 변경되면 즉시 사진이 표시됩니다. 그리고 onchange를 사용하면 해당 값을 변경할 때 마우스를 사용하여 빈 공간이나 다른 위치를 클릭하여 입력 요소가 초점을 잃게(onblur) 이벤트를 활성화해야 하며 이미지 표시가 변경됩니다!

예 2:

------------------------------- ------ -------

onpropertychange이벤트가 너무 귀여워서 첫눈에 반했어요

onChange:현재 요소가 포커스를 잃고 요소의 내용이 변경될 때 트리거되는 이벤트 [마우스 및 키보드로 트리거 가능]

그래서 스크립트에 의해 객체의 값이 변경되면 사용자가 마우스나 키보드를 움직이지 않기 때문에 onChange 이벤트가 트리거되지 않습니다.

관련 라벨:
js
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿