온체인지 이벤트
예시
사용자가 <select> 요소의 선택된 옵션을 변경할 때 JavaScript를 실행합니다.
<select onchange="myFunction()">
아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.
정의 및 사용
onchange 이벤트는 요소의 값이 변경되었을 때 발생합니다.
라디오 버튼과 체크박스의 경우, 체크 상태가 변경되면 onchange 이벤트가 발생합니다.
팁: 이 이벤트는 oninput 이벤트와 유사합니다. 차이점은 oninput 이벤트는 요소의 값이 변경된 직후에 발생하는 반면 onchange는 내용이 변경된 후 요소가 포커스를 잃으면 발생한다는 것입니다. 다른 차이점은 onchange 이벤트가 <select> 요소에서도 작동한다는 것입니다.
브라우저 지원
| Event | |||||
|---|---|---|---|---|---|
| onchange | Yes | Yes | Yes | Yes | Yes |
통사론
HTML:
<element onchange="myScript">
자바스크립트:
object.onchange = function(){myScript};
JavaScript에서 addEventListener() 메서드를 사용하여 다음을 수행합니다.
object.addEventListener("change", myScript);
참고: addEventListener () 메서드는 Internet Explorer 8 및 이전 버전에서 지원되지 않습니다.
기술적 세부 사항
| 거품: | 네 |
|---|---|
| 취소 가능: | 아니 |
| 이벤트 유형: | 이벤트 |
| 지원되는 HTML 태그: | <input type="checkbox">, <input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type=" 파일">, <입력 유형="월">, <입력 유형="숫자">, <입력 유형="비밀번호">, <입력 유형="라디오">, <입력 유형="범위">, < 입력 유형="검색">, <입력 유형="전화">, <입력 유형="텍스트">, <입력 유형="시간">, <입력 유형="url">, <입력 유형="주 ">, <선택> 및 <텍스트 영역> |
| DOM 버전: | 레벨 2 이벤트 |
더 많은 예
예시
사용자가 입력 필드의 내용을 변경할 때 JavaScript를 실행합니다.
<input type="text"
onchange="myFunction()">