[Javascript] 핸드폰번호 입력시 하이픈(-) 자동 입력하기

 

<input type="text" id="hp" name="hp" class="form-control" value="">
<span style="color:red;">ex) 010-2222-3333</span>
 
 
<script>
function addHyphenToPhoneNumber(phoneNumberInput) {
    const phoneNumber = phoneNumberInput.value;
    const length = phoneNumber.length;
 
    if(length >= 9) {
        let numbers = phoneNumber.replace(/[^0-9]/g, "")
                    .replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-$2-$3`);
        phoneNumberInput.value = numbers;
    }
}
 
const phoneInput = document.getElementById("hp");
phoneInput.addEventListener("input", () => {
    addHyphenToPhoneNumber(phoneInput);
});
</script>

 

 

참고 : https://jong-bae.tistory.com/66