HTML 참고 설명서

HTML 태그 전체 목록

HTML onchange 이벤트 속성

onchange는 현재 요소의 change 이벤트의 이벤트 처리 함수를 가져오거나 설정할 수 있습니다.

온라인 예제

사용자가 <select> 요소의 선택된 옵션을 변경할 때, JavaScript가 실행됩니다:

예제

<!DOCTYPE html>
<html>
<head>
<title>HTML onchange 이벤트 속성의 사용(기본 튜토리얼 웹　oldtoolbag.com)</title>
</head>
<body>
<p>Select a new car from the list.</p>
<select id="mySelect" onchange="myFunction()">
　　<option value="Audi">Audi
　　<option value="BMW">BMW
　　<option value="Mercedes">Mercedes
　　<option value="Volvo">Volvo
</select>
<p>When you select a new car, a function is triggered which outputs the value of the selected car.</p>
<p id="demo"></p>
<script>
function myFunction() {
　　var x = document.getElementById("mySelect").value;
　　document.getElementById("demo").innerHTML = "You selected: "　+　x;
}
</script>
</body>
</html>

테스트를 해보세요 ‹/›

브라우저 호환성

IEFirefoxOperaChromeSafari

모든 주요 브라우저가 onchange 이벤트 속성을 지원합니다.

정의와 사용법

onchange 속성은 요소의 값이 변경될 때 발생합니다.

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

HTML 4.01 HTML과5사이의 차이

차이가 없습니다.

문법

<요소 onchange="script">

속성 값

값	설명
script	onchange 이벤트가 발생할 때 실행할 스크립트를 정의합니다.

HTML 이벤트 속성

HTML: <template> 태그