Input field for accepting mobile numbers

Question

I want to get mobile number as input of different countries. I tried using below code:

<input type="tel" minlength="8" maxlength="10" name="Number" id="Number" pattern="[0-9]{3}-[0-9]{2}-[0-9]{3}" class="form-control wow fadeInUp" placeholder="* WhatsApp Number" required/>

But it also accepts characters, so how can i apply length validation and number validation.

Answer 1

this code will prevent character to be typed. While typing anything except numbers are omitted.

<input type="tel" required minlength="8" maxlength="15" name="Number" id="Number"  class="form-control wow fadeInUp" placeholder="* WhatsApp Number" oninput="this.value = this.value.replace(/[^0-9+()]/g, '');" pattern=".{8,10}" placeholder="123-45-678" />