如何使用 jQuery 驗證 10 位手機號碼

Question

 <div> <span id="mobile-valid"> <i class="fa fa-check"></i> Valid Mobile No </span> <span id="mobile-invalid" > Invalid mobile No </span> </div> <div> Mobile No </div> <div> <input id="mobile-num" type="text"/> </div>

如何使用 jQuery Ajax 對 10 位手機號碼進行驗證？只允許使用數字不能使用字符或字母數字字符。那么我如何使用 jquery Ajax 進行驗證。我想在上面的輸入框中顯示 Invalid Email .and（不要想顯示警報）

Answer 1

這將為您服務...

 $(document).ready(function(){ $("#mobile-num").on("blur", function(){ var mobNum = $(this).val(); var filter = /^\\d*(?:\\.\\d{1,2})?$/; if (filter.test(mobNum)) { if(mobNum.length==10){ alert("valid"); $("#mobile-valid").removeClass("hidden"); $("#folio-invalid").addClass("hidden"); } else { alert('Please put 10 digit mobile number'); $("#folio-invalid").removeClass("hidden"); $("#mobile-valid").addClass("hidden"); return false; } } else { alert('Not a valid number'); $("#folio-invalid").removeClass("hidden"); $("#mobile-valid").addClass("hidden"); return false; } }); });

 .hidden{ display: none; }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="mobile"> <div class="input"> <div class="label"> <div class="label-1"> <span id="mobile-valid" class="hidden mob"> <i class="fa fa-check pwd-valid"></i>Valid Mobile No </span> <span id="folio-invalid" class="hidden mob-helpers"> <i class="fa fa-times mobile-invalid"></i>Invalid mobile No </span> </div> </div> <div class="row"> <div class="col-xs-3"> <div class="label-2"> Mobile No </div> </div> <div class="col-xs-9"> <input id="mobile-num" type="text" class="form-control form-change-element" /> </div> </div> </div> </div>

Answer 2

<form action="#">
  Mobile number: <input type="text" name="mobile" pattern="^(?:(?:\+|0{0,2})91(\s*[\-]\s*)?|[0]?)?[789]\d{9}$" title="Enter Valid mobile number ex.9811111111" required>
  <input type="submit">
</form>

從9,8,7開始，您還可以添加更多內容。

您可以使用https://regex101.com/對其進行測試

有效號碼是。

9883443344
09883443344
919883443344
0919883443344
+919883443344
+91-9883443344
0091-9883443344
+91 -9883443344
+91- 9883443344
+91 - 9883443344
0091 - 9883443344

Answer 3

試試這個代碼。 它包含用於移動電話的十位數驗證：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <style type="text/css">
    body
{
    padding: 10px;
    font-family: Arial;
    Font-size: 10pt;
}
span
{
    font-weight:bold;
}

.san{
    height: 26px;
    width: 250px;
    border: 1px solid #9E9E9E;
    padding: 5px;
    border-radius: 5px;
    margin: 10px;

}

  </style>
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
$(document).ready(function() {
    $('#txtPhone').blur(function(e) {
        if (validatePhone('txtPhone')) {
            $('#spnPhoneStatus').html('Valid Mobil Number');
            $('#spnPhoneStatus').css('color', 'green');
        }
        else {
            $('#spnPhoneStatus').html('Invalid Mobile Number');
            $('#spnPhoneStatus').css('color', 'red');
        }
    });
});

function validatePhone(txtPhone) {
    var a = document.getElementById(txtPhone).value;
    var filter = /[1-9]{1}[0-9]{9}/;
    if (filter.test(a)) {
        return true;
    }
    else {
        return false;
    }
}
});//]]> 

</script>
</head>
<body>
  Phone Number: <input type='text' id='txtPhone' class="san" maxlength="10"/>
<span id="spnPhoneStatus"></span>
</body>
</html>

這是演示簽出

Answer 4

在您的jquery函數中嘗試此代碼

var mobileNum = $(this).val();
var validateMobNum= /^\d*(?:\.\d{1,2})?$/;
if (validateMobNum.test(mobileNum ) && mobileNum.length == 10) {
    alert("Valid Mobile Number");
}
else {
    alert("Invalid Mobile Number");
}

Answer 5

試試這種東西

var value = "1234567.....";
var NumberRegex = /^[0-9]*$/;
if(value.length <= 10){
if(NumberRegex.test(value)){
//do whatever you want to
}else{
alert('invalid')
}

}

Answer 6

使用正則表達式對手機號碼進行jQuery驗證

驗證包括：

僅10位數字（無字母和特殊字符）

數字從6,7,8,9開始

 <html> <body> <label>Mobile Number:</label> <input type="text" class="form-control mobile-valid"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> $(document).ready(function() { $('.mobile-valid').on('keypress', function(e) { var $this = $(this); var regex = new RegExp("^[0-9\\b]+$"); var str = String.fromCharCode(!e.charCode ? e.which : e.charCode); // for 10 digit number only if ($this.val().length > 9) { e.preventDefault(); return false; } if (e.charCode < 54 && e.charCode > 47) { if ($this.val().length == 0) { e.preventDefault(); return false; } else { return true; } } if (regex.test(str)) { return true; } e.preventDefault(); return false; }); }); </script> </body> </html>

對於演示請點擊這里！

Answer 7

這是驗證您的手機號碼格式的代碼。 這個 function 返回一個 boolean 值。

function isValidMobileNumber(mobileNumber) {
  var mobileNumberPattern = /^[0-9]{10}$/;
  return mobileNumberPattern.test(mobileNumber);
}

if(isValidMobileNumber()){
//Valid mobile number format.
}else{
//Invalid mobile number format. 
}

Answer 8

var pattern= /^[0]*(\d{9})*\s*$/;

此模式僅用於驗證斯里蘭卡數字。 在上面的代碼行中，只驗證以 0 開頭的手機號碼。

如何使用 jQuery 驗證 10 位手機號碼

問題描述

8 個解決方案

解決方案1
5 已采納 2017-01-16 07:09:14

解決方案2
1 2017-01-16 06:55:48

解決方案3
1 2017-12-29 07:08:33

解決方案4
1 2018-03-15 06:00:55

解決方案5
0 2017-01-16 06:53:51

解決方案6
0 2018-08-11 12:40:58

使用正則表達式對手機號碼進行jQuery驗證

解決方案7
0 2023-03-20 07:21:47

解決方案8
-1 2021-08-06 09:26:15

如何使用 jQuery 驗證 10 位手機號碼

問題描述

8 個解決方案

解決方案1 5 已采納 2017-01-16 07:09:14

解決方案2 1 2017-01-16 06:55:48

解決方案3 1 2017-12-29 07:08:33

解決方案4 1 2018-03-15 06:00:55

解決方案5 0 2017-01-16 06:53:51

解決方案6 0 2018-08-11 12:40:58

使用正則表達式對手機號碼進行jQuery驗證

解決方案7 0 2023-03-20 07:21:47

解決方案8 -1 2021-08-06 09:26:15

解決方案1
5 已采納 2017-01-16 07:09:14

解決方案2
1 2017-01-16 06:55:48

解決方案3
1 2017-12-29 07:08:33

解決方案4
1 2018-03-15 06:00:55

解決方案5
0 2017-01-16 06:53:51

解決方案6
0 2018-08-11 12:40:58

解決方案7
0 2023-03-20 07:21:47

解決方案8
-1 2021-08-06 09:26:15