[JS] 전화번호 입력 시 자동 하이픈 넣기

전화번호 입력 시 자동 하이픈 넣기

 

 

전화번호 입력 시 자동으로 하이픈을 넣게 구현했다.

 

 

---

 

 

1. HTML

<input class="form-control" name="VC_HPP" oninput="autoHyphen(this)" value="<c:out value='${STD_HPP}'></c:out>">

 

728x90

 

2. JS

function autoHyphen(input) {
    // 숫자만 남기고 모든 문자 제거
    var phoneNumber = input.value.replace(/[^\d]/g, "");

    // 전화번호 형식에 맞게 하이푼 추가
    if (phoneNumber.length >= 4 && phoneNumber.length <= 7) {
        input.value = phoneNumber.slice(0, 3) + "-" + phoneNumber.slice(3);
    } else if (phoneNumber.length >= 8) {
        input.value = phoneNumber.slice(0, 3) + "-" + phoneNumber.slice(3, 7) + "-" + phoneNumber.slice(7);
    }
}