코드랩 레퍼런스

Event Attributes 본문

BASIC

Event Attributes

webstoryboy 2016. 10. 5. 12:57
Event 속성은 자바스크립의 이벤트 기능과 같은 기능으로 HTML에도 이벤트 기능이 추가되었습니다.

Window Event Attributes

속성 값(예) 설명 버전
onafterprint onafterprint="function()" 문서가 인쇄된 후 스크립 이벤트를 설정합니다. html5
onbeforeprint onbeforeprint="function()" 문서가 인쇄되기 전에 스크립 이벤트를 설정합니다. html5
onbeforeunload onbeforeunload="function()" 사용자가 현재 페이지에서 떠나기 전에 이벤트를 설정합니다. html5
onerror onerror="function()" 페이지가 오류 났을 때 이벤트를 설정합니다. html5
onhashchange onhashchange="function()" URL 앵커 부분의 변화가 있을 때 이벤트를 설정합니다. html5
onload onload="function()" 페이지가 로드되면 이벤트를 설정합니다. -
onmessage onmessage="function()" 메세지가 작동되면 이벤트를 설정합니다. html5
onoffline onoffline="function()" 브라우저가 오프라인 일 때 이벤트를 설정합니다. html5
ononline ononline="function()" 브라우저가 온라인 일 때 이벤트를 설정합니다. html5
onpagehide onpagehide ="function()" 사용자가 다른 페이지로 이동 할 때 이벤트를 설정합니다. html5
onpageshow onpageshow ="function()" 사용자가 다른 페이지로 탐색 할 때 이벤트를 설정합니다. html5
onpopstate onpopstate ="function()" 브라우저 히스토리가 변경될 때 이벤트를 설정합니다. html5
onresize onresize ="function()" 브라우저 크기가 변경될 때 이벤트를 설정합니다. html5
onstorage onstorage ="function()" 브라우저 저장소가 업데이트 될 때 이벤트를 설정합니다. html5
onunload onunload ="function()" 페이지가 로드되지 않거나 닫혔을 때 이벤트를 설정합니다. html5

Form Event Attributes

속성 값(예) 설명 버전
onblur onblur="function()" 요소에 포커스를 잃었을 때 이벤트를 발생합니다. -
onchange onchange="function()" 요소의 값이 변경되었을 때 이벤트를 발생합니다. -
oncontextmenu oncontextmenu="function()" 요쇼의 메뉴가 펼쳐졌을 때 이벤트를 발생합니다. html5
onfocus onfocus="function()" 요소에 포커스 되었을 때 이벤트를 발생합니다. -
oninput oninput="function()" 사용자가 요소에 입력했을 때 이벤트가 발생합니다. html5
oninvalid oninvalid="function()" 사용자가 입력한 요소가 유효하지 않을 때 이벤트가 발생합니다. html5
onreset onreset="function()" 사용자가 리셋 버튼을 눌렀을 경우 이벤트가 발생합니다. html5
onsearch onsearch="function()" 사용자가 검색 영역에 입력할 때 이벤트가 발생합니다. -
onselect onselect="function()" 사용자가 셀렉트 메뉴를 선택했을 때 이벤트가 발생합니다. -
onsubmit onsubmit="function()" 사용자가 입력양식을 보낼 때 이벤트가 발생합니다. -

Keyboard Event Attributes

속성 값(예) 설명 버전
onkeydown onkeydown="function()" 사용자가 키를 눌렀을 때 이벤트를 설정합니다. -
onkeypress onkeypress="function()" 사용자가 키를 누르고 있을 때 이벤트를 설정합니다. -
onkeyup onkeyup="function()" 사용자가 키를 눌렀다 뗐을 때 이벤트를 설정합니다. -

Mouse Event Attributes

속성 값(예) 설명 버전
onclick onclick="function()" 요소를 클릭했을 때 이벤트를 설정합니다. -
ondblclick ondblclick="function()" 요소를 더블 클릭했을 때 이벤트를 설정합니다. -
ondrag ondrag="function()" 요소를 드래그 했을 때 이벤트를 설정합니다. html5
ondragend ondragend="function()" 요소를 드래그하고 끝났을 때 이벤트를 설정합니다. html5
ondragenter ondragenter="function()" 요소를 드래그 하고 있을 때 이벤트를 설정합니다. html5
ondragleave ondragleave="function()" 요소를 드래그 하고 떠났을 때 이벤트를 설정합니다. html5
ondragover ondragover="function()" 타겟 요소 위에 드래그 했을 때 이벤트를 설정합니다. html5
ondragstart ondragstart="function()" 타겟 요소에게 드래그를 시작했을 때 이벤트를 설정합니다. html5
ondrop ondrop="function()" 타겟 요소에 떨어트렸을 때 이벤트를 설정합니다. html5
onmousedown onmousedown="function()" 요소에 마우스를 클릭했을 때 이벤트를 설정합니다. -
onmousemove onmousemove="function()" 타겟 요소에 마우스를 움직였을 때 이벤트를 설정합니다. -
onmouseout onmouseout="function()" 타겟 요소에서 마우스가 벗어 났을 때 이벤트를 설정합니다. -
onmouseover onmouseover="function()" 타겟 요소에 마우스가 오버했을 때 이벤트를 설정합니다. -
onmouseup onmouseup="function()" 타겟 요소에 마우스를 클릭하고 놓았을 때 이벤트를 설정합니다. -
onmousewheel onmousewheel="function()" 마우스 휠을 사용할 때 이벤트를 설정합니다. 현재는 onwheel을 사용합니다. -
onscroll onscroll="function()" 스크롤 했을 때 이벤트를 설정합니다. html5
onwheel onwheel="function()" 마우스 휠을 사용했을 때 이벤트를 설정합니다. html5

Clipboard Event Attributes

속성 값(예) 설명 버전
oncopy oncopy="function()" 사용자가 요소를 복사 했을 때 이벤트를 설정합니다. -
oncut oncut="function()" 사용자가 요소를 잘라내기 했을 때 이벤트를 설정합니다. -
onpaste onpaste="function()" 사용자가 요소를 붙여넣기 했을 때 이벤트를 설정합니다. -

Media Event Attributes

속성 값(예) 설명 버전
onabort onabort="function()" 미디어가 중단되었을 때 이벤트를 발생합니다. -
oncanplay oncanplay="function()" 미디어가 플레이 준비되었을 때 이벤트를 발생합니다. html5
oncanplaythrough oncanplaythrough="function()" 미디어가 버퍼링 되는 동안 이벤트를 발생합니다. html5
oncuechange oncuechange="function()" 트랙 요소가 변경 되었을 때 이벤트를 발생합니다. html5
ondurationchange ondurationchange="function()" 미디어의 길이가 변할 때 이벤트를 발생합니다. html5
onemptied onemptied="function()" 미디어 파일이 갑자기 사용할 수 없을 때 이벤트를 발생합니다. html5
onended onended="function()" 미디어 재생이 끝났을 때 이벤트를 발생합니다. html5
onerror onerror="function()" 미디어 파일이 오류가 발생하면 이벤트를 발생합니다.. html5
onloadeddata onloadeddata="function()" 미디어 파일이 로드될 때 이벤트를 발생합니다. html5
onloadedmetadata onloadedmetadata="function()" 메다데이터를 로드할 때 이벤트를 발생합니다. html5
onloadstart onloadstart="function()" 미디어 파일이 로드되기 전 시작될 때 이벤트를 발생합니다. html5
onpause onpause="function()" 미디어 사용자가 일시 중지시켰을 때 이벤트를 발생합니다. html5
onplay onplay="function()" 미디어가 재생 준비가 되었을 때 이벤트를 발생합니다. html5
onplaying onplaying="function()" 미디어가 실제로 재생하고 있을 때 이벤트를 발생합니다. html5
onprogress onprogress="function()" 브라우저가 미디어 파일을 얻고 있는 과정에 있을 때 이벤트를 발생합니다. html5
onratechange onratechange="function()" 사용자가 미디어 재생 속도(빨리감기,슬로우모션)를 변경했을 때 이벤트를 발생합니다. html5
onseeked onseeked="function()" 미디어의 속성 변경이 끝났을 때 이벤트를 발생합니다. html5
onseeking onseeking="function()" 미디어의 속성 변경이 시작했을 때 이벤트를 발생합니다. html5
onstalled onstalled="function()" 브라우저가 어떠한 이유로 미디어 파일을 가져올 수 없을 때 이벤트를 발생합니다. html5
onsuspend onsuspend="function()" 브라우저가 어떠한 이유로 미디어 파일을 가져오는 것이 중단 됐을 때 이벤트를 발생합니다. html5
ontimeupdate ontimeupdate="function()" 미디어의 재생위치가 사용자에 의해 변경 되었을 때 이벤트를 발생합니다. html5
onvolumechange onvolumechange="function()" 미디어 파일의 볼륨이 변경(무소음도 포함) 되었을 때 이벤트를 발생합니다. html5
onwaiting onwaiting="function()" 미디어가 재생되고 있는 도중 버퍼링 현상이 생겼을 때 이벤트를 발생합니다. html5

Misc Event Attributes

속성 값(예) 설명 버전
onerror onerror="function()" 외부 파일을 로드하는 동안 에러가 발생할 경우 이벤트를 발생합니다. html5
onshow onshow="function()" menu 태그에서 메뉴가 보여졌을 때 이벤트를 발생합니다. html5
ontoggle ontoggle="function()" details 태그에서 요소가 열리고 닫힐 때 이벤트를 발생합니다. html5

Compatibility

크롬 아이콘 파이어폭스 아이콘 사파리 아이콘 오페라 아이콘 안드로이드 아이콘 ios 아이콘 익스플로러6 아이콘 6 익스플로러7 아이콘 7 익스플로러8 아이콘 8 익스플로러9 아이콘 9 익스플로러10 아이콘 10 익스플로러11 아이콘 11 엣지 아이콘
onafterprint
onbeforeprint
onbeforeunload
onerror
onhashchange
onload
onmessage
onoffline
ononline
onpagehide
onpageshow
onpageshow
onresize
onunload

Ad

Comments