stackoom
  简体   繁体   中英

Validation of a phone number with a regex

 原文  2018-09-07 08:39:09  7   2    javascript/ regex

Question

I want the input to only allow numeric ( [0-9] ) characters and + , ( , ) and a space ( ). This validates a mobile number input field.

An example is: +00 (000) 000 0000

I already tried this:

if (e.which != 8 && e.which != 0 && (e.which < 48 || e.which > 57)) {
    $(this).val('');
} else {

Can somebody help me finding a regular expression to solve this?

2 answers

solution1
 3  2018-09-07 09:15:54

Please check following will help you on the validation of Phone Number. Also you can various filtering by using the different input masks. 

 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <input id="phone-number" name="phone-number" type="text" class="masked" placeholder="+xx (xxx) xxx xxxx" pattern="+\\d{2} (\\d{3}) \\d{3} \\d{4}" title="Enter valid phone number" /> <script data-autoinit="true"> var InputMask = function (opts) { if (opts && opts.masked) { // Make it easy to wrap this plugin and pass elements instead of a selector opts.masked = typeof opts.masked === string ? document.querySelectorAll(opts.masked) : opts.masked; } if (opts) { this.opts = { masked: opts.masked || document.querySelectorAll(this.d.masked), mNum: opts.mNum || this.d.mNum, mChar: opts.mChar || this.d.mChar, error: opts.onError || this.d.onError } } else { this.opts = this.d; this.opts.masked = document.querySelectorAll(this.opts.masked); } this.refresh(true); }; var inputMask = { // Default Values d: { masked: '.masked', mNum: '*xdDmMyY9', mChar: '_', onError: function () { } }, refresh: function (init) { var t, parentClass; if (!init) { this.opts.masked = document.querySelectorAll(this.opts.masked); } for (i = 0; i < this.opts.masked.length; i++) { t = this.opts.masked[i] parentClass = t.parentNode.getAttribute('class'); if (!parentClass || (parentClass && parentClass.indexOf('shell') === -1)) { this.createShell(t); this.activateMasking(t); } } }, // replaces each masked t with a shall containing the t and it's mask. createShell: function (t) { var wrap = document.createElement('span'), mask = document.createElement('span'), emphasis = document.createElement('i'), tClass = t.getAttribute('class'), pTxt = t.getAttribute('placeholder'), placeholder = document.createTextNode(pTxt === '****' ? '***' : pTxt); t.setAttribute('maxlength', pTxt.length); t.setAttribute('data-placeholder', pTxt); t.removeAttribute('placeholder'); if (!tClass || (tClass && tClass.indexOf('masked') === -1)) { t.setAttribute('class', tClass + ' masked'); } mask.setAttribute('aria-hidden', 'true'); mask.setAttribute('id', t.getAttribute('id') + 'Mask'); mask.appendChild(emphasis); mask.appendChild(placeholder); wrap.setAttribute('class', 'shell'); t.parentNode.insertBefore(wrap, t); wrap.appendChild(t); wrap.appendChild(mask); }, setValueOfMask: function (e) { var value = e.target.value, placeholder = e.target.getAttribute('data-placeholder'); return "<i>" + value + "</i>" + (placeholder === '****' ? '***' : placeholder).substr(value.length); }, // add event listeners activateMasking: function (t) { var that = this; if (t.addEventListener) { // remove "if" after death of IE 8 t.addEventListener('keyup', function (e) { that.handleValueChange.call(that, e); }, false); } else if (t.attachEvent) { // For IE 8 t.attachEvent('onkeyup', function (e) { e.target = e.srcElement; that.handleValueChange.call(that, e); }); } }, handleValueChange: function (e) { var id = e.target.getAttribute('id'); if (e.target.value == document.querySelector('#' + id + 'Mask i').innerHTML) { return; // Continue only if value hasn't changed } document.getElementById(id).value = this.handleCurrentValue(e); document.getElementById(id + 'Mask').innerHTML = this.setValueOfMask(e); }, handleCurrentValue: function (e) { var isCharsetPresent = e.target.getAttribute('data-charset'), placeholder = isCharsetPresent || e.target.getAttribute('data-placeholder'), value = e.target.value, l = placeholder.length, newValue = '', i, j, isInt, isLetter, strippedValue; // strip special characters strippedValue = isCharsetPresent ? value.replace(/\\W/g, "") : value.replace(/\\D/g, ""); for (i = 0, j = 0; i < l; i++) { isInt = !isNaN(parseInt(strippedValue[j])); isLetter = strippedValue[j] ? strippedValue[j].match(/[AZ]/i) : false; matchesNumber = this.opts.mNum.indexOf(placeholder[i]) >= 0; matchesLetter = this.opts.mChar.indexOf(placeholder[i]) >= 0; if ((matchesNumber && isInt) || (isCharsetPresent && matchesLetter && isLetter)) { newValue += strippedValue[j++]; } else if ((!isCharsetPresent && !isInt && matchesNumber) || (isCharsetPresent && ((matchesLetter && !isLetter) || (matchesNumber && !isInt)))) { //this.opts.onError( e ); // write your own error handling function return newValue; } else { newValue += placeholder[i]; } // break if no characters left and the pattern is non-special character if (strippedValue[j] == undefined) { break; } } if (e.target.getAttribute('data-valid-example')) { return this.validateProgress(e, newValue); } return newValue; }, validateProgress: function (e, value) { var validExample = e.target.getAttribute('data-valid-example'), pattern = new RegExp(e.target.getAttribute('pattern')), placeholder = e.target.getAttribute('data-placeholder'), l = value.length, testValue = ''; //convert to months if (l == 1 && placeholder.toUpperCase().substr(0, 2) == 'MM') { if (value > 1 && value < 10) { value = '0' + value; } return value; } // test the value, removing the last character, until what you have is a submatch for (i = l; i >= 0; i--) { testValue = value + validExample.substr(value.length); if (pattern.test(testValue)) { return value; } else { value = value.substr(0, value.length - 1); } } return value; } }; for (var property in inputMask) { if (inputMask.hasOwnProperty(property)) { InputMask.prototype[property] = inputMask[property]; } } // Declaritive initalization (function () { var scripts = document.getElementsByTagName('script'), script = scripts[scripts.length - 1]; if (script.getAttribute('data-autoinit')) { new InputMask(); } })(); </script> </body> </html>

solution2
 -2  2018-09-07 09:09:43

There are many similar questions like yours, please do a search on StackOverflow first next time, eg this question .

You could try the following simple regex, which only checks for the characters you listed:

^[0-9+() ]+$
  • ^ and $ enforce the whole string to be your matching pattern
  • [0-9+() ]+ defines a set of your characters which need to occur at least once

Here is a live example: https://regex101.com/r/t2oAF6/1

暂无
暂无

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

Related Question Phone number regex validation Phone number regex validation [Areacode and phone number] Regex for Australian phone number validation Javascript phone number validation: no regex evaluation Javascript RegEx build for a phone number validation Phone number validation regex with custom constraints Single dash phone number - regex validation Regex for mobile number, phone number validation with some conditions Regex Javascript Phone number validation min max length check Regex for phone number validation with min and max length check
Related Tags
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM