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/event/preventdefault/index.html | 93 ++++++++++++++++++++++++ 1 file changed, 93 insertions(+) create mode 100644 files/ko/web/api/event/preventdefault/index.html (limited to 'files/ko/web/api/event/preventdefault') diff --git a/files/ko/web/api/event/preventdefault/index.html b/files/ko/web/api/event/preventdefault/index.html new file mode 100644 index 0000000000..71f4fdb229 --- /dev/null +++ b/files/ko/web/api/event/preventdefault/index.html @@ -0,0 +1,93 @@ +--- +title: event.preventDefault +slug: Web/API/Event/preventDefault +translation_of: Web/API/Event/preventDefault +--- +

{{ ApiRef() }}

+ +

개요

+ +

이벤트를 취소할 수 있는 경우, 이벤트의 전파를 막지않고 그 이벤트를 취소합니다.

+ +

구문

+ +
event.preventDefault()
+
+ +

예제

+ +

다음의 예제에서는 체크박스를 클릭했을 때 발생하는 동작을 멈추는 방법을 살펴보겠습니다. 

+ +
<html>
+<head>
+<title>preventDefault 예제</title>
+
+<script type="text/javascript">
+
+function stopDefAction(evt) {
+  evt.preventDefault();
+}
+</script>
+</head>
+
+<body>
+
+<p>체크박스 컨트롤을 클릭해 주세요</p>
+
+<form>
+<input type="checkbox" onclick="stopDefAction(event);"/>
+<label for="checkbox">체크박스</label>
+</form>
+
+</body>
+</html>
+
+ +

preventDefault의 예제를 여기에서 확인할 수 있습니다.

+ +

아래의 예제에서는, preventDefault() 를 사용해서 올바르지 않은 텍스트가 입력란에 입력되는것을 막는 방법을 설명하고 있습니다.

+ +
<html>
+<head>
+<title>preventDefault 예제</title>
+
+<script type="text/javascript">
+
+function checkName(evt) {
+var charCode = evt.charCode;
+
+  if (charCode != 0) {
+    if (charCode < 97 || charCode > 122) {
+      evt.preventDefault();
+      alert("소문자만 입력할 수 있습니다." + "\n"
+            + "charCode: " + charCode + "\n"
+      );
+    }
+  }
+}
+
+</script>
+</head>
+
+<body>
+
+<p>당신의 이름을 소문자만으로 입력해주세요.</p>
+<form>
+<input type="text" onkeypress="checkName(event);"/>
+</form>
+
+</body>
+</html>
+
+ +

주의

+ +

이벤트를 취소하는 도중에 preventDefault를 호출하게되면, 일반적으로는 브라우저의 구현에 의해 처리되는 기존의 액션이 동작하지 않게되고, 그 결과 이벤트가 발생하지 않게됩니다.

+ +

이벤트의 취소가능 여부는 event.cancelable를 사용해서 확인할 수 있습니다. 취소불가능한 이벤트에 대해서 preventDefault를 호출해도 결과는 없습니다.

+ +

preventDefault는 DOM을 통한 이벤트의 전파를 막지않습니다. 전파를 막을때는 event.stopPropagation를 사용해주세요.

+ +

사양

+ +

DOM Level 2 Events: preventDefault

-- cgit v1.2.3-54-g00ecf