블로그

[JavaScript] 기본 이벤트 동작 중지시키기(가로채기) event.preventDefault()

Code › JavaScript · 2019-01-05 · 공개

event.preventDefault() 
- <a>,<input>,<textarea> <form > 등의 기본 이벤트 동작을 막는다.
- 이벤트 전달을 막지는 않음

event.cancelable
- 취소가능한 이벤트 인지 판단

//====================================
// 예제

<script type="text/javascript">
        function stopDefAction() {
if( event.cancelable ){//취소가능한 이벤트 인가? 판단
event.preventDefault();//체크박스의 기본 동작(박스에 체크 표시 그리는 것등)이 실행안됨
}
            console.log("체크박스1");//여기는 실행된다.
        }
    </script>

    <p>체크박스 컨트롤을 클릭해 주세요</p>

    <form>
        <input type="checkbox" onclick="stopDefAction();" />
        <label for="checkbox">체크박스</label>
    </form>

//=============
//참고
https://developer.mozilla.org/ko/docs/Web/API/Event/preventDefault

알림