JavaScript - 포커스(onfocus), 해제(onblur) Event

onfocus : 포커스를 받은 경우 이벤트 설정

onblur : 포커스가 해지될 때 이벤트 설정

 

HTML 소스

<input type="text" id="msg">
<div id="result"></div>

 

스크립트

<script>
    var msg = document.querySelector("#msg");
    var result = document.querySelector("#result");

    // msg에 포커스가 올 경우 이벤트 발생
    msg.onfocus = function (e) {
        result.innerHTML = "포커스 이벤트 발생함";
    };
    msg.onblur = function (e) {
        if (msg.value.length != 6) {
            alert("6자리 입력이 되어야 합니다.");
        }
        result.innerHTML = "포커스 빠져나감";
    };
</script>

 

결과