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