From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- files/ko/web/api/globaleventhandlers/index.html | 268 +++++++++++++++++++++ .../api/globaleventhandlers/onchange/index.html | 73 ++++++ .../web/api/globaleventhandlers/onclick/index.html | 89 +++++++ .../globaleventhandlers/oncontextmenu/index.html | 103 ++++++++ .../api/globaleventhandlers/ondblclick/index.html | 70 ++++++ .../api/globaleventhandlers/onkeydown/index.html | 60 +++++ .../web/api/globaleventhandlers/onkeyup/index.html | 27 +++ .../globaleventhandlers/onpointerenter/index.html | 79 ++++++ .../api/globaleventhandlers/onscroll/index.html | 98 ++++++++ .../api/globaleventhandlers/onsubmit/index.html | 70 ++++++ .../globaleventhandlers/ontouchstart/index.html | 128 ++++++++++ 11 files changed, 1065 insertions(+) create mode 100644 files/ko/web/api/globaleventhandlers/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onchange/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onclick/index.html create mode 100644 files/ko/web/api/globaleventhandlers/oncontextmenu/index.html create mode 100644 files/ko/web/api/globaleventhandlers/ondblclick/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onkeydown/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onkeyup/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onpointerenter/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onscroll/index.html create mode 100644 files/ko/web/api/globaleventhandlers/onsubmit/index.html create mode 100644 files/ko/web/api/globaleventhandlers/ontouchstart/index.html (limited to 'files/ko/web/api/globaleventhandlers') diff --git a/files/ko/web/api/globaleventhandlers/index.html b/files/ko/web/api/globaleventhandlers/index.html new file mode 100644 index 0000000000..46d38934b1 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/index.html @@ -0,0 +1,268 @@ +--- +title: GlobalEventHandlers +slug: Web/API/GlobalEventHandlers +tags: + - API + - DOM + - HTML DOM + - Mixin + - Reference +translation_of: Web/API/GlobalEventHandlers +--- +
{{ApiRef("HTML DOM")}}
+ +

GlobalEventHandlers 믹스인mixin은 {{domxref("HTMLElement")}}, {{domxref("Document")}}, {{domxref("Window")}} 등 여러 인터페이스가 공유하는 공통 이벤트 처리기를 묘사합니다. 물론, 각각의 인터페이스는 아래에 나열된 항목뿐만 아니라 더 많은 이벤트 처리기를 추가할 수 있습니다.

+ +
+

참고: GlobalEventHandlers는 인터페이스가 아닌 믹스인입니다. 따라서 GlobalEventHandlers 자료형을 가진 객체를 만들 수는 없습니다.

+
+ +

속성

+ +

이 인터페이스는 아래에 나열된 이벤트 처리기를 위한 속성만을 갖습니다.

+ +

이벤트 처리기

+ +

다음 이벤트 처리기들은 {{domxref("GlobalEventHandlers")}} 믹스인이 정의하고, {{domxref("HTMLElement")}}, {{domxref("Document")}}, {{domxref("Window")}}와 웹 워커의 {{domxref("WorkerGlobalScope")}}가 구현합니다.

+ +
+
+
{{domxref("GlobalEventHandlers.onabort")}}
+
{{event("abort")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onanimationcancel")}} {{Non-standard_inline}}
+
실행 중이던 CSS 애니메이션이 취소됐음을 알리는 {{event("animationcancel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onanimationend")}} {{Non-standard_inline}}
+
실행 중이던 CSS 애니메이션이 끝났음을 알리는 {{event("animationend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onanimationiteration")}} {{Non-standard_inline}}
+
실행 중인 CSS 애니메이션의 다음 회차 재생이 시작됐음을 알리는 {{event("animationiteration")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onanimationstart")}} {{Non-standard_inline}}
+
CSS 애니메이션의 재생이 시작됐음을 알리는 {{event("animationstart")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onauxclick")}} {{Non-standard_inline}}
+
마우스 휠 클릭 등 비주요 버튼이 눌렸음을 알리는 {{event("auxclick")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onblur")}}
+
{{event("blur")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onerror")}}
+
{{event("error")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("OnErrorEventHandler")}}.
+
{{domxref("GlobalEventHandlers.onfocus")}}
+
{{event("focus")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oncancel")}}
+
{{event("cancel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oncanplay")}}
+
{{event("canplay")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oncanplaythrough")}}
+
{{event("canplaythrough")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onchange")}}
+
{{event("change")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onclick")}}
+
{{event("click")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onclose")}}
+
{{event("close")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oncontextmenu")}}
+
{{event("contextmenu")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oncuechange")}}
+
{{event("cuechange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondblclick")}}
+
{{event("dblclick")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondrag")}}
+
{{event("drag")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragend")}}
+
{{event("dragend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragenter")}}
+
{{event("dragenter")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragexit")}}
+
{{event("dragexit")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragleave")}}
+
{{event("dragleave")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragover")}}
+
{{event("dragover")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondragstart")}}
+
{{event("dragstart")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondrop")}}
+
{{event("drop")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ondurationchange")}}
+
{{event("durationchange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onemptied")}}
+
{{event("emptied")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onended")}}
+
{{event("ended")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ongotpointercapture")}}
+
+

{{event("gotpointercapture")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.

+
+
{{domxref("GlobalEventHandlers.oninput")}}
+
{{event("input")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.oninvalid")}}
+
{{event("invalid")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onkeydown")}}
+
{{event("keydown")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onkeypress")}}
+
{{event("keypress")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onkeyup")}}
+
{{event("keyup")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onload")}}
+
{{event("load")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onloadeddata")}}
+
{{event("loadeddata")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onloadedmetadata")}}
+
{{event("loadedmetadata")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onloadend")}}
+
자원의 불러오기가 멈췄음을 나타내는 {{event("loadend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onloadstart")}}
+
자원을 불러오기 시작함을 나타내는 {{event("loadstart")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onlostpointercapture")}}
+
+

{{event("lostpointercapture")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.

+
+
{{domxref("GlobalEventHandlers.onmousedown")}}
+
{{event("mousedown")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmouseenter")}}
+
{{event("mouseenter")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmouseleave")}}
+
{{event("mouseleave")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmousemove")}}
+
{{event("mousemove")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmouseout")}}
+
{{event("mouseout")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmouseover")}}
+
{{event("mouseover")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmouseup")}}
+
{{event("mouseup")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onmousewheel")}} {{Non-standard_inline}} {{Deprecated_inline}}
+
{{event("mousewheel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}. onwheel을 대신 사용하세요.
+
{{ domxref("GlobalEventHandlers.onwheel") }}
+
{{event("wheel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpause")}}
+
{{event("pause")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onplay")}}
+
{{event("play")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onplaying")}}
+
{{event("playing")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerdown")}}
+
{{event("pointerdown")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointermove")}}
+
{{event("pointermove")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerup")}}
+
{{event("pointerup")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointercancel")}}
+
{{event("pointercancel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerover")}}
+
{{event("pointerover")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerout")}}
+
{{event("pointerout")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerenter")}}
+
{{event("pointerenter")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerleave")}}
+
{{event("pointerleave")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerlockchange")}} {{experimental_inline}}
+
{{event("pointerlockchange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onpointerlockerror")}} {{experimental_inline}}
+
{{event("pointerlockerror")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onprogress")}}
+
{{event("progress")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onratechange")}}
+
{{event("ratechange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onreset")}}
+
{{event("reset")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onresize")}}
+
{{event("resize")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onscroll")}}
+
{{event("scroll")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onseeked")}}
+
{{event("seeked")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onseeking")}}
+
{{event("seeking")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onselect")}}
+
{{event("select")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onselectstart")}}
+
사용자가 웹 페이지의 텍스트 등을 선택하기 시작함을 나타내는 {{event("selectionchange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onselectionchange")}}
+
웹 페이지의 선택 영역(텍스트 등)이 바뀌었음을 나타내는 {{event("selectionchange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onshow")}}
+
{{event("show")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onsort")}} {{experimental_inline}}
+
{{event("sort")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onstalled")}}
+
{{event("stalled")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onsubmit")}}
+
{{event("submit")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onsuspend")}}
+
{{event("suspend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontimeupdate")}}
+
{{event("timeupdate")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onvolumechange")}}
+
{{event("volumechange")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontouchcancel")}} {{Non-standard_inline}} {{Experimental_inline}}
+
{{event("touchcancel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontouchend")}} {{Non-standard_inline}} {{Experimental_inline}}
+
{{event("touchend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontouchmove")}} {{Non-standard_inline}} {{Experimental_inline}}
+
{{event("touchmove")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontouchstart")}} {{Non-standard_inline}} {{Experimental_inline}}
+
{{event("touchstart")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontransitioncancel")}}
+
CSS 트랜지션이 취소됐음을 알리는 {{event("transitioncancel")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.ontransitionend")}}
+
CSS 트랜지션이 끝났음을 알리는 {{event("transitionend")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
{{domxref("GlobalEventHandlers.onwaiting")}}
+
{{event("waiting")}} 이벤트가 발생했을 때 호출할 코드를 나타내는 {{domxref("EventHandler")}}.
+
+
+ +

메소드

+ +

이 인터페이스는 메서드를 정의하지 않습니다.

+ +

명세

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
명세상태코멘트
{{SpecName("Selection API",'', 'Extension to GlobalEventHandlers')}}{{Spec2('Selection API')}}onselectionchange 추가.
{{SpecName('Pointer Lock', '#extensions-to-the-document-interface', 'Extension of Document')}}{{Spec2('Pointer Lock')}}{{domxref("Document")}} 에 onpointerlockchange 와 onpointerlockerror 추가. GlobalEventHandlers 에 실험적으로 구현되었음.
{{SpecName('HTML WHATWG', '#globaleventhandlers', 'GlobalEventHandlers')}}{{Spec2('HTML WHATWG')}}{{SpecName("HTML5.1")}} 최신 스냅샷 이후에 변경 사항 없음.
{{SpecName('HTML5.1', '#globaleventhandlers', 'GlobalEventHandlers')}}{{Spec2('HTML5.1')}}{{SpecName("HTML WHATWG")}} 의 스냅샷. {{SpecName("HTML5 W3C")}} 스냅샷 이후에 onsort 가 추가되었음.
{{SpecName("HTML5 W3C", "#globaleventhandlers", "GlobalEventHandlers")}}{{Spec2('HTML5 W3C')}}{{SpecName("HTML WHATWG")}} 의 스냅샷. GlobalEventHandlers 생성(그 전 타겟에 있던 속성들)
+ +

브라우저 호환성

+ +
+ + +

{{Compat("api.GlobalEventHandlers")}}

+
+ +

함께 보기

+ + diff --git a/files/ko/web/api/globaleventhandlers/onchange/index.html b/files/ko/web/api/globaleventhandlers/onchange/index.html new file mode 100644 index 0000000000..bbefe1251d --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onchange/index.html @@ -0,0 +1,73 @@ +--- +title: GlobalEventHandlers.onchange +slug: Web/API/GlobalEventHandlers/onchange +tags: + - API + - GlobalEventHandlers + - HTML DOM + - Property + - Reference +translation_of: Web/API/GlobalEventHandlers/onchange +--- +
+
{{ ApiRef("HTML DOM") }}
+
+ +

onchange 속성은 {{event("change")}} 이벤트의 이벤트 핸들러를 설정하고 반환합니다.

+ +

구문

+ +
target.onchange = functionRef;
+
+ +

functionRef는 null 또는 이벤트 핸들러를 지정하는 JavaScript function 함수 중 하나여야 합니다.

+ +

예제

+ +

HTML

+ +
<input type="text" placeholder="Type something here, then click outside of the field." size="50">
+<p id="log"></p>
+ +

JavaScript

+ +
let input = document.querySelector('input');
+let log = document.getElementById('log');
+
+input.onchange = handleChange;
+
+function handleChange(e) {
+  log.textContent = `The field's value is
+      ${e.target.value.length} character(s) long.`;
+}
+ +

결과

+ +

{{EmbedLiveSample("예제")}}

+ +

명세

+ + + + + + + + + + + + + + +
명세상태비고
{{SpecName('HTML WHATWG','webappapis.html#handler-onchange','onchange')}}{{Spec2('HTML WHATWG')}} 
+ +

브라우저 호환성

+ +

{{Compat("api.GlobalEventHandlers.onchange")}}

+ +

같이 보기

+ + diff --git a/files/ko/web/api/globaleventhandlers/onclick/index.html b/files/ko/web/api/globaleventhandlers/onclick/index.html new file mode 100644 index 0000000000..9b655c0421 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onclick/index.html @@ -0,0 +1,89 @@ +--- +title: GlobalEventHandlers.onclick +slug: Web/API/GlobalEventHandlers/onclick +tags: + - API + - Event Handler + - HTML DOM + - Property + - Reference +translation_of: Web/API/GlobalEventHandlers/onclick +--- +
{{apiref("HTML DOM")}}
+ +

{{domxref("GlobalEventHandlers")}} 믹스인mixin의 onclick 속성은 주어진 요소의 {{event("click")}} 이벤트를 처리하기 위한 {{domxref("EventHandler")}}입니다.

+ +

click 이벤트는 사용자가 요소를 클릭할 때 {{event("mousedown")}}과 {{event("mouseup")}} 다음으로 발동합니다.

+ +
참고: click 이벤트에 행동을 붙일 땐, 마우스나 터치 스크린을 사용하지 않는 사용자도 그 행동을 할 수 있도록 {{event("keydown")}}이벤트에도 똑같이 적용하는걸 고려해보세요.
+ +

구문

+ +
target.onclick = functionRef;
+
+ +

값

+ +

functionRef는 함수 이름이거나 함수 표현식으로, 유일한 매개변수로 {{domxref("MouseEvent")}} 객체를 받습니다. 함수 내에서 {{jsxref("Operators/this", "this")}}는 이벤트가 발동한 요소를 가리킵니다.

+ +

하나의 객체에는 하나의 onclick 처리기만 할당할 수 있습니다. 더 유연한{{domxref("EventTarget.addEventListener()")}} 메서드를 선호하는 편이 좋을 수도 있습니다.

+ +

예제

+ +

다음 예제는 클릭 위치를 기록합니다.

+ +

HTML

+ +
<p>Click anywhere in this example.</p>
+<p id="log"></p>
+ +

JavaScript

+ +
let log = document.getElementById('log');
+
+document.onclick = inputChange;
+
+function inputChange(e) {
+  log.textContent = `Position: (${e.clientX}, ${e.clientY})`;
+}
+ +

결과

+ +

{{EmbedLiveSample("예제")}}

+ +

명세

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG','webappapis.html#handler-onclick','onclick')}}{{Spec2('HTML WHATWG')}} 
+ +

브라우저 호환성

+ +
+ + +

{{Compat("api.GlobalEventHandlers.onclick")}}

+
+ +

같이 보기

+ + diff --git a/files/ko/web/api/globaleventhandlers/oncontextmenu/index.html b/files/ko/web/api/globaleventhandlers/oncontextmenu/index.html new file mode 100644 index 0000000000..c13513c82e --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/oncontextmenu/index.html @@ -0,0 +1,103 @@ +--- +title: GlobalEventHandlers.oncontextmenu +slug: Web/API/GlobalEventHandlers/oncontextmenu +translation_of: Web/API/GlobalEventHandlers/oncontextmenu +--- +
{{ ApiRef("HTML DOM") }}
+ +

윈도우에서 마우스 오른쪽 클릭시 발생하는 이벤트 이벤트 핸들러 속성 입니다. 기본동작을 막지 않는 한 (아래의 예제를 참조하세요), 브라우저의 컨텍스트 메뉴가 활성화됩니다. (그러나 IE8는 이것과 관련된 버그가 있어 contextmenu 가 정의 되어있다고 할지라도 활성화 되지 않습니다).  이 이벤트는 비활성화되지 않은(non-disabled) 오른쪽 클릭 이벤트와 함께 발생하며   "contextmenu" 속성 을 가진 엘리먼트에는 달리지 않는다는 것을 유의하세요.

+ +

Syntax

+ +
window.oncontextmenu = funcRef;
+//funcRef refers to the function to be called
+ +

Example

+ +

페이지상에서 오른쪽 클릭을 막는 예제들 입니다:

+ +
document.oncontextmenu = function () { // Use document as opposed to window for IE8 compatibility
+   return false;
+};
+
+window.addEventListener('contextmenu', function (e) { // Not compatible with IE < 9
+    e.preventDefault();
+}, false);
+
+ +

Specifications

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG','webappapis.html#handler-oncontextmenu','oncontextmenu')}}{{Spec2('HTML WHATWG')}} 
+ +

Browser Compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + +
FeatureChromeEdgeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewChrome for AndroidEdgeFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari Mobile
Basic support{{CompatNo}}{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
+
diff --git a/files/ko/web/api/globaleventhandlers/ondblclick/index.html b/files/ko/web/api/globaleventhandlers/ondblclick/index.html new file mode 100644 index 0000000000..7444c2c81b --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/ondblclick/index.html @@ -0,0 +1,70 @@ +--- +title: GlobalEventHandlers.ondblclick +slug: Web/API/GlobalEventHandlers/ondblclick +tags: + - API + - Event Handler + - HTML DOM + - Property + - Reference +translation_of: Web/API/GlobalEventHandlers/ondblclick +--- +
{{ApiRef("HTML DOM")}}
+ +

ondblclick property는 현재 요소(element)의 onDblClick 이벤트 핸들러 코드를 돌려줍니다.

+ +

구문

+ +
element.ondblclick = function;
+
+ + + +
element.ondblclick = function() { console.log("ondblclick event detected!"); };
+
+ +

예제

+ +

다음 예제는 더블클릭의 위치를 기록합니다.

+ +

HTML

+ +
<p>Double click anywhere in this example.</p>
+<p id="log"></p>
+ +

JavaScript

+ +
let log = document.getElementById('log');
+
+document.ondblclick = logDoubleClick;
+
+function logDoubleClick(e) {
+  log.textContent = `Position: (${e.clientX}, ${e.clientY})`;
+}
+ +

결과

+ +

{{EmbedLiveSample("예제")}}

+ +

명세

+ + + + + + + + + + + + + + +
명세상태비고
{{SpecName('HTML WHATWG','webappapis.html#handler-ondblclick','ondblclick')}}{{Spec2('HTML WHATWG')}}
+ +

브라우저 호환성

+ +
{{Compat("api.GlobalEventHandlers.ondblclick")}}
diff --git a/files/ko/web/api/globaleventhandlers/onkeydown/index.html b/files/ko/web/api/globaleventhandlers/onkeydown/index.html new file mode 100644 index 0000000000..d5f598104a --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onkeydown/index.html @@ -0,0 +1,60 @@ +--- +title: GlobalEventHandlers.onkeydown +slug: Web/API/GlobalEventHandlers/onkeydown +tags: + - API + - HTML DOM + - NeedsContent + - NeedsExample +translation_of: Web/API/GlobalEventHandlers/onkeydown +--- +
{{ApiRef("HTML DOM")}}
+ +

onkeydown 속성은 현재 요소(element)의 onKeyDown 이벤트 핸들러 코드를 돌려줍니다

+ +
element.onkeydown = event handling code
+ +

Example

+ +

This example logs the {{domxref("KeyboardEvent.code")}} value whenever you press down a key inside the {{HtmlElement("input")}} element.

+ +

HTML

+ +
<input>
+<p id="log"></p>
+ +

JavaScript

+ +
const input = document.querySelector('input');
+const log = document.getElementById('log');
+
+input.onkeydown = logKey;
+
+function logKey(e) {
+  log.textContent += ` ${e.code}`;
+}
+ +

Result

+ +

{{EmbedLiveSample("Example")}}

+ +

명세

+ + + + + + + + + + + + + + +
명세상태비고
{{SpecName('HTML WHATWG','webappapis.html#handler-onkeydown','onkeydown')}}{{Spec2('HTML WHATWG')}} 
+ +

브라우저 호환성

+ +

{{Compat("api.GlobalEventHandlers.onkeydown")}}

diff --git a/files/ko/web/api/globaleventhandlers/onkeyup/index.html b/files/ko/web/api/globaleventhandlers/onkeyup/index.html new file mode 100644 index 0000000000..7ba6e8c6b6 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onkeyup/index.html @@ -0,0 +1,27 @@ +--- +title: GlobalEventHandlers.onkeyup +slug: Web/API/GlobalEventHandlers/onkeyup +translation_of: Web/API/GlobalEventHandlers/onkeyup +--- +
{{ApiRef("HTML DOM")}}
+ +

onkeyup 속성은 현재 요소에서 onKeyUp 이벤트 핸들러를 반환합니다.

+ +

문법

+ +
element.onkeyup = event handling code
+
+ +

예제

+ +
 <input type="text" onKeyUp="keyWasPressed(event)">
+ <script>function keyWasPressed(evt){ console.log(evt.keyCode) }</script>
+
+ +

참고

+ +

keyup 이벤트는 사용자가 눌렀던 키를 놓을 때 발생합니다.

+ +

명세서

+ +

명세 내용이 없습니다.

diff --git a/files/ko/web/api/globaleventhandlers/onpointerenter/index.html b/files/ko/web/api/globaleventhandlers/onpointerenter/index.html new file mode 100644 index 0000000000..a9e0087ecc --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onpointerenter/index.html @@ -0,0 +1,79 @@ +--- +title: GlobalEventHandlers.onpointerenter +slug: Web/API/GlobalEventHandlers/onpointerenter +translation_of: Web/API/GlobalEventHandlers/onpointerenter +--- +
{{ApiRef("HTML DOM")}}
+ +

{{domxref("GlobalEventHandlers")}} mixin의 onpointerenter property는 {{event("pointerenter")}} 이벤트를 처리하는 {{domxref("EventHandler")}} 이다.

+ +

Syntax

+ +
targetElement.onpointerenter = enterHandler;
+
+var enterHandler = targetElement.onpointerenter;
+
+ +

Value

+ +
+
enterHandler
+
The pointerenter event handler for element targetElement.
+
+ +

Example

+ +

아래 예제는 element의 pointerenter 이벤트 핸들러를 설정하는 onpointerenter 의 2가지 사용법을 보여준다.

+ +
<html>
+<script>
+function enterHandler(ev) {
+  // pointerenter event처리
+}
+function init() {
+  let el = document.getElementById('target1');
+  el.onpointerenter = enterHandler;
+}
+</script>
+
+<body onload="init();">
+  <div id="target1"> Touch me ... </div>
+  <div id="target2" onpointerenter="enterHandler(event)"> Touch me ... </div>
+</body>
+</html>
+
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Pointer Events 2','#dom-globaleventhandlers-onpointerenter', 'onpointerenter')}}{{Spec2('Pointer Events 2')}}Non-stable version
{{SpecName('Pointer Events', '#widl-GlobalEventHandlers-onpointerenter', 'onpointerenter')}}{{Spec2('Pointer Events')}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("api.GlobalEventHandlers.onpointerenter")}}

+ +

See also

+ + diff --git a/files/ko/web/api/globaleventhandlers/onscroll/index.html b/files/ko/web/api/globaleventhandlers/onscroll/index.html new file mode 100644 index 0000000000..1c32b77ee9 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onscroll/index.html @@ -0,0 +1,98 @@ +--- +title: GlobalEventHandlers.onscroll +slug: Web/API/GlobalEventHandlers/onscroll +translation_of: Web/API/GlobalEventHandlers/onscroll +--- +
{{ApiRef("HTML DOM")}}
+ +
{{domxref("GlobalEventHandlers")}} 의 onscroll 이벤트는 {{domxref("EventHandler")}} 의 scroll 이벤트를 상속받았습니다.
+ +
+ +
document view 나  element 가 스크롤이 됬을 때 이벤트가  발생합니다.
+ +
+ +
+

Note: onscroll 과 {{domxref("GlobalEventHandlers.onwheel", "onwheel")}} 이벤트를 혼동하지 마세요. onwheel 보통 휠의 회전을 처리하고, onscroll은 객체의 내용의 스크롤을 처리합니다.

+
+ +

Syntax

+ +
target.onscroll = functionRef;
+
+ +

Value

+ +

functionRef 은(는) 함수 표현식 또는 함수 이름 이며, 이 객체는 오직 {{domxref("UIEvent")}} 객체만 인수로 받습니다.

+ +

오직 하나의 onscroll 이벤트만 하나의 객체에 할당 할 수 있습니다.  EventTarget.addEventListener() 를 사용하여  scroll 이벤트를 정의 할 수 있습니다.

+ +

Example

+ +

다음 예제는  {{HtmlElement("textarea")}}에 발생한 스크롤 이벤트 결과를 출력해 줍니다.

+ +

HTML

+ +
<textarea>1 2 3 4 5 6 7 8 9</textarea>
+<p id="log"></p>
+ +

CSS

+ +
textarea {
+  width: 4rem;
+  height: 8rem;
+  font-size: 3rem;
+}
+ +

JavaScript

+ +
const textarea = document.querySelector('textarea');
+const log = document.getElementById('log');
+
+textarea.onscroll = logScroll;
+
+function logScroll(e) {
+  log.textContent = `Scroll position: ${e.target.scrollTop}`;
+}
+ +

Result

+ +

{{EmbedLiveSample("Example", 700, 200)}}

+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG','#handler-onscroll','onscroll')}}{{Spec2('HTML WHATWG')}}
{{SpecName("DOM3 Events", "#event-type-scroll", "onscroll")}}{{Spec2("DOM3 Events")}}Initial definition
+ +

Browser compatibility

+ + + +

{{Compat("api.GlobalEventHandlers.onscroll")}}

+ +

See also

+ + diff --git a/files/ko/web/api/globaleventhandlers/onsubmit/index.html b/files/ko/web/api/globaleventhandlers/onsubmit/index.html new file mode 100644 index 0000000000..e8e72ac2e0 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/onsubmit/index.html @@ -0,0 +1,70 @@ +--- +title: GlobalEventHandlers.onsubmit +slug: Web/API/GlobalEventHandlers/onsubmit +tags: + - API + - HTML DOM + - 레퍼런스 + - 속성 +translation_of: Web/API/GlobalEventHandlers/onsubmit +--- +
{{ApiRef("HTML DOM")}}
+ +

 

+ +

현재 창에서 폼을 제출하는 이벤트를 다루는 이벤트 핸들러

+ +

문법

+ +
window.onsubmit = funcRef;
+
+ +

매개 변수

+ + + +

예제

+ +
<html>
+<script>
+function reg() {
+  window.captureEvents(Event.SUBMIT);
+  window.onsubmit = hit;
+}
+
+function hit() {
+  console.log('hit');
+}
+</script>
+
+<body onload="reg();">
+<form>
+  <input type="submit" value="submit" />
+</form>
+<div id="d"> </div>
+</body>
+</html>
+
+ +

알아두기

+ +

제출 이벤트는 사용자가 폼 내부에 있는 제출 버튼(<input type="submit"/>)을 눌렀을 때 발생한다.

+ +

명세

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG','webappapis.html#handler-onsubmit','onsubmit')}}{{Spec2('HTML WHATWG')}} 
diff --git a/files/ko/web/api/globaleventhandlers/ontouchstart/index.html b/files/ko/web/api/globaleventhandlers/ontouchstart/index.html new file mode 100644 index 0000000000..0017375993 --- /dev/null +++ b/files/ko/web/api/globaleventhandlers/ontouchstart/index.html @@ -0,0 +1,128 @@ +--- +title: GlobalEventHandlers.ontouchstart +slug: Web/API/GlobalEventHandlers/ontouchstart +translation_of: Web/API/GlobalEventHandlers/ontouchstart +--- +
{{ApiRef("HTML DOM")}}
+ +

{{event("touchstart")}} 이벤트를 위한 {{domxref("GlobalEventHandlers","global event handler")}}

+ +

{{SeeCompatTable}}

+ +
+

Note: 이 요소는 아직 표준화 되지 않은 기술입니다. It is specified in the {{SpecName('Touch Events 2')}} {{Spec2('Touch Events 2')}} 명세에서 작성된 기술이며 {{SpecName('Touch Events')}} {{Spec2('Touch Events')}}에는 포함되어 있지 않습니다. 따라서 아직 대부분의 브라우저에서는 사용되지 않는 요소입니다.

+
+ +

문법

+ +
var startHandler = someElement.ontouchstart;
+
+ +

반환 값

+ +
+
startHandler
+
someElement를 위한 touchstart 이벤트 핸들러
+
+ +

예제

+ +

이 예제는 HTML 요소에 touchstart e이벤트 핸들러를 등록하기 위한 두 방법을 보여주고 있습니다.

+ +
<html>
+<script>
+function startTouch(ev) {
+ // 이벤트 내부
+}
+function init() {
+ var el=document.getElementById("target1");
+ el.ontouchstart = startTouch;
+}
+</script>
+<body onload="init();">
+<div id="target1"> 터치해주세요... </div>
+<div id="target2" ontouchstart="startTouch(event)"> 터치해주세요... </div>
+</body>
+</html>
+
+ +

명세

+ + + + + + + + + + + + + + +
명세현황비고
{{SpecName('Touch Events 2','#widl-GlobalEventHandlers-ontouchstart')}}{{Spec2('Touch Events 2')}}Non-stable version.
+ +

브라우저 호환성

+ +

{{CompatibilityTable}}

+ +
+ + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support     
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidAndroid WebviewChrome for AndroidFirefox Mobile (Gecko)Firefox OSIE MobileOpera MobileSafari Mobile
Basic support        
+
+ +

 

+ +

더 보기

+ + -- cgit v1.2.3-54-g00ecf