onchange 이벤트

정의와 사용법

요소의 값이 변경될 때 onchange 이벤트가 발생합니다.

단수 선택 상태가 변경될 때 onchange 이벤트가 발생합니다.

안내:}}이 이벤트는 다음과 유사합니다 oninput 이벤트이 이벤트는 다른 이벤트와 차이점이 있습니다. oninput 이벤트는 요소 값이 변경된 후 즉시 발생하며, onchange는 요소가 포커스를 잃고 내용이 변경된 후 발생합니다. 또한 onchange 이벤트는 <select> 요소에도 적용됩니다.

예제

예제 1

사용자가 <select> 요소의 선택된选项을 변경할 때 JavaScript를 실행합니다:

<select onchange="myFunction()">

직접 시도해 보세요

예제 2

사용자가 입력 필드의 내용을 변경할 때 JavaScript를 실행합니다:

<input type="text" onchange="myFunction()">

직접 시도해 보세요

문법

HTML에서:

<element onchange="myScript">

직접 시도해 보세요

JavaScript에서:

object.onchange = function(){myScript};

직접 시도해 보세요

JavaScript에서 addEventListener() 메서드를 사용하면:

object.addEventListener("change", myScript);

직접 시도해 보세요

비고:Internet Explorer 8 또는 이전 버전에서는 지원되지 않습니다 addEventListener() 메서드

기술적인 세부 사항

버블링: 지원
취소 가능: 지원되지 않음
이벤트 유형: 이벤트
지원되는 HTML 태그: <input type="checkbox">, <input type="color">, <input type="date">, <input type="datetime">, <input type="email">, <input type="file">, <input type="month">, <input type="number">, <input type="password">, <input type="radio">, <input type="range">, <input type="search">, <input type="tel">, <input type="text">, <input type="time">, <input type="url">, <input type="week">, <select> 이며 <textarea>
DOM 버전: 레벨 2 이벤트

브라우저 지원

이벤트 크롬 IE 파이어폭스 사파리 오페라
onchange 지원 지원 지원 지원 지원