Nov 19, 2020
1 min read
How To Validate Phone Number Using Jquery Input Mask
- In this small tutorial I will explain you how to validate phone number using jQuery input mask, Using jQuery input mask we can validate different type of phone no with different country code.
- Here, we are using jQuery input mask JS for this example, so we can easily validate phone no.
<html>
<head>
<title>jquery input mask phone number validation — websolutionstuff</title>
<link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/jquery.inputmask.bundle.min.js"></script>
</head>
<body>
<div class=”container” style=”border:1px solid red; padding: 0px 20px 20px 20px; margin-top: 20px;”>
<h1>jquery input mask phone number validation — websolutionstuff.com</h1>
<br>
<strong>Phone Number:</strong>
<input type=”text” name=”phone” class=”phone_number form-control” value=”9876543210">
<br>
<strong>Phone Number:</strong>
<input type=”text” name=”phone” class=”phone_number_2 form-control” value=”9876543210">
<br>
<strong>Phone Number:</strong>
<input type=”text” name=”phone” class=”phone_number_3 form-control” value=”91 9876543210">
</div>
<script>
$(document).ready(function(){
$(‘.phone_number’).inputmask(‘(999)-999–9999’);
$(‘.phone_number_2’).inputmask(‘(99)-9999–9999’);
$(‘.phone_number_3’).inputmask(‘+99–9999999999’);
});
</script>
</body>
</html>In above code I have added input mask in jQuery for different validation.
You can see output in below screen print.
