js 전화번호 제약조건

기여·2024년 6월 16일
0

소소한 개발팁

목록 보기
38/103

1, 숫자만 허용
2, 11자리까지만 허용

예제:

<script>
//전화번호 scr
document.getElementById('custTel').addEventListener('input', function(e) {
    const input = e.target;
    const value = input.value;
    const regex = /^[0-9]*$/; // 숫자만 허용하는 정규식

    if (!regex.test(value)) {
        alert("숫자만 입력 가능합니다.");
        input.value = value.replace(/[^0-9]/g, ''); // 숫자가 아닌 문자를 제거
        return;
    }

    if (value.length > 11) {
        alert("11자리 숫자만 입력 가능합니다.");
        input.value = value.slice(0, 11); // 11자리 초과 부분 제거
    }
});
//전화번호 scr 끝
</script>
			<th><p>전화번호:</p></th>
            <td><input class="input" type="tel" name="custTel" id="custTel" 
            placeholder="01023456789" required>
            <small>'-' 제외 입력해주세요.</small>
            </td>

결과:
숫자 외 '-' 입력시도 시

11자리 넘게 입력시도 시

+) 11자리 미만 입력하고 다른 필드로 이동 시 관련 함수와 알럿도 띄우려 하다가 보류 🤓
팝업이 자주 뜨면 사용성이 떨어질 수도 있으란 핑계로~

profile
기기 좋아하는 여자

0개의 댓글