如何验证电话号码的 HTML 输入

Question

Brief

Validate a UK Mobile Phone Number field in a HTML Form to take into account the following rules:

1. Phone Number must begin 07
2. Phone Number must not exceed 11 Digits
3. Spaces are allowed (ignored). I've found that Auto-Fill features sometimes save numbers like 0123456789 or 01234 456 789. I'd rather not cause the inconvenience to the user to reformat their auto-fill input.

Valid Input Examples

• 07234567890
• 07234 567 895
• 07 23 45 78 90

Where I am

So far, I've only been able to validate my second point using:

<input id="phonenum" type="tel" pattern="^\\d{11}$" required >

Answer 1

function validatePhoneNumber(){
    var e = document.getElementById('phonenum');
    var phoneNo;
    var firstLetter;
    var secondLetter;
    if(!e){
        return false;
    }

    phoneNo = e.value.replace(/ /g, ''); // remove spaces
    if(phoneNo.length != 11 ){
        return false;
    }

    firstLetter = phoneNo[0];
    secondLetter = phoneNo[1];
    if(firstLetter != "0" || secondLetter != "7"){
        return false;
    }

    return true;
}

Answer 2

如果你想使用正则表达式，你可以使用以下

^(0\W*7\W*(?:\d\W*){9})$

Answer 3

希望能帮助到你

 <input class="form-control" pattern="[789][0-9]{9}" type="text">