使用 javascript 验证电话号码
Posted
技术标签:
【中文标题】使用 javascript 验证电话号码【英文标题】：Validate phone number using javascript 【发布时间】：2013-08-24 22:00:46 【问题描述】：我正在尝试使用 javascript 验证电话号码，例如 123-345-3456 和 (078)789-8908。
这是我的代码
function ValidateUSPhoneNumber(phoneNumber)
var regExp = /^(\([0-9]3\) |[0-9]3-)[0-9]3-[0-9]4/;
var phone = phoneNumber.match(regExp);
if (phone)
alert('yes');
return true;
alert('no');
return false;
我正在使用ValidateUSPhoneNumber('123-345-34567') 测试该函数，该函数在最后一个连字符前有 5 位数字，根据正则表达式是无效的。但是该函数返回true。
谁能解释一下原因？
【问题讨论】：
【参考方案1】：用于验证电话号码的 JavaScript：
function phonenumber(inputtxt)
var phoneno = /^\(?([0-9]3)\)?[-. ]?([0-9]3)[-. ]?([0-9]4)$/;
if(inputtxt.value.match(phoneno))
return true;
else
alert("message");
return false;
以上脚本匹配：
XXX-XXX-XXXX XXX.XXX.XXXX XXXXXXXXX
如果要在数字前使用+号，请按以下方式+XX-XXXX-XXXX +XX.XXXX.XXXX +XX XXXX XXXX使用如下代码：
function phonenumber(inputtxt)
var phoneno = /^\+?([0-9]2)\)?[-. ]?([0-9]4)[-. ]?([0-9]4)$/;
if(inputtxt.value.match(phoneno))
return true;
else
alert("message");
return false;
【讨论】：
不客气.. 谢谢指正.. @Stano 这将匹配(123-456 7890 或 123).456-7890，我确定这是需要的。
我无法理解你在做什么.. 可以简单解释一下@M42
试试我给出的例子。括号在您的正则表达式中是可选的，因此您可以有一个但不能有第二个。此外，如果有一个连字符作为第一个分隔符，您接受点作为第二个分隔符...
能否请您指出您的答案来自这里（除非这是您自己的帖子或其他内容）：w3resource.com/javascript/form/phone-no-validation.php【参考方案2】：
这个正则表达式/^(\([0-9]3\)\s*|[0-9]3\-)[0-9]3-[0-9]4$/ 验证以下所有内容：
'123-345-3456';
'(078)789-8908';
'(078) 789-8908'; // Note the space
分解正在发生的事情：
-
开头的组验证两种方式，
(XXX) 或 XXX-，右括号后可选空格。
组后的部分检查XXX-XXX
【讨论】：
它将匹配(123- 456-7890 或 123)456-7890，我不确定是否需要。【参考方案3】：
我是这样做的。
function validate(phone)
const regex = /^\(?([0-9]3)\)?[-. ]?([0-9]3)[-. ]?([0-9]4)$/;
console.log(regex.test(phone))
validate('1234567890') // true
validate(1234567890) // true
validate('(078)789-8908') // true
validate('123-345-3456') // true【讨论】：
【参考方案4】：这是迄今为止我发现使用 javascript 正则表达式检查电话号码格式的最简单方法。这个特定的例子检查它是否是一个 10 位数字。
<input name="phone" pattern="^\d10$" type="text" size="50">
如果模式与值不匹配，则单击提交按钮时输入字段会被标记，不需要其他 css 或 js。
【讨论】：
【参考方案5】：谁能解释原因
因为您的正则表达式与输入匹配。只是输入还包括额外的字符。您包含 '^' 来表示行首，但是（正如 Andy 所说）您应该包含 '$' 来表示行尾。
如果您的正则表达式以“^”开头并以“$”结尾，那么它将只匹配仅与您的正则表达式匹配的行。
通过以“^”开始您的正则表达式而不以“$”结尾，您可以匹配以匹配您的正则表达式的序列开头的行，但行可以在匹配序列的后面有任何其他内容。
【讨论】：
【参考方案6】：你可以使用这个 jquery 插件：
http://digitalbush.com/projects/masked-input-plugin/
请参阅演示选项卡，电话选项。
【讨论】：
【参考方案7】：谁能解释一下原因？？
发生这种情况是因为您的正则表达式不以任何锚元字符结尾，例如行尾 $ 或单词边界 \b。
因此，当您询问正则表达式引擎 123-345-34567 是否是有效的电话号码时，它会尝试在此字符串中查找匹配项，因此它将 123- 与此部分匹配 (\([0-9]3\) |[0-9]3-) 然后它将345- 与此部分匹配[0-9]3- 然后匹配 3456 与这部分 [0-9]4。
现在引擎发现它已经遍历了整个正则表达式，并在您的输入中找到了一个与正则表达式匹配的字符串，尽管在输入字符串中留下了一个字符-数字 7-，所以它停止了并返回成功，因为它找到了匹配的子字符串。
如果您在正则表达式的末尾包含了$ 或\b，引擎会以与以前相同的方式运行，然后它会尝试匹配$ 或\b，但会找到最后一个数字- 7 - 而且它不是单词边界\b 也不是行尾$ 所以它会停止并且找不到匹配项。
【讨论】：
【参考方案8】：^(\(?[0-9]3\)?)((\s|\-)1)?[0-9]3((\s|\-)1)?[0-9]4$
假设您正在验证美国的电话号码，这将起到作用。
首先，我们允许 0 或 1 个开括号开始 \(?
然后，我们允许 0-9 [0-9]3 之间的 3 个连续数字
之后，我们重复第一步并允许 0 或 1 个右括号 \)?
对于第二个分组，我们首先允许空格或连字符 0 或 1 次 ((\s|\-)1)?
这在第二组和第三组数字之间重复，我们检查 3 个连续数字，然后检查 4 个连续数字以结束它。对于美国电话号码，我认为这涵盖了人们可能会格式化号码的许多不同方式的基础，但限制性足以让他们无法传递不合理的字符串。
【讨论】：
【参考方案9】：在 JavaScript 中，以下正则表达式可用于电话号码：
^((\+1)?[\s-]?)?\(?[1-9]\d\d\)?[\s-]?[1-9]\d\d[\s-]?\d\d\d\d
例如; 9999875099、8750999912等
参考：https://techsolutions.filebizz.com/2020/08/regular-expression-for-phone-number-in.html
【讨论】：
【参考方案10】：在正则表达式末尾添加单词边界\b：
/^(\([0-9]3\) |[0-9]3-)[0-9]3-[0-9]4\b/
如果) 后面的空格是可选的：
/^(\([0-9]3\)\s*|[0-9]3-)[0-9]3-[0-9]4\b/
【讨论】：
这个正则表达式对于(078)789-8908 也失败了。请参阅我在 Andy 帖子中的评论。【参考方案11】：
在正则表达式的末尾添加一个 $ 表示模式的结束：
var regExp = /^(\([0-9]3\)\s?|[0-9]3-)[0-9]3-[0-9]4$/;
【讨论】：
由于空间问题，(078)789-8908 失败。你应该在那里添加一个?。
问题中的示例中没有空格，但我会修改我的答案。
你的验证了有空格的，而不是没有空格的。
固定以考虑可选空间。【参考方案12】：
如果您使用输入标签，则此代码将对您有所帮助。我自己编写了这段代码，我认为这是在输入中使用的非常好的方法。但您可以使用您的格式更改它。它将帮助用户更正输入标签的格式。
$("#phone").on('input', function() //this is use for every time input change.
var inputValue = getInputValue(); //get value from input and make it usefull number
var length = inputValue.length; //get lenth of input
if (inputValue < 1000)
inputValue = '1('+inputValue;
else if (inputValue < 1000000)
inputValue = '1('+ inputValue.substring(0, 3) + ')' + inputValue.substring(3, length);
else if (inputValue < 10000000000)
inputValue = '1('+ inputValue.substring(0, 3) + ')' + inputValue.substring(3, 6) + '-' + inputValue.substring(6, length);
else
inputValue = '1('+ inputValue.substring(0, 3) + ')' + inputValue.substring(3, 6) + '-' + inputValue.substring(6, 10);
$("#phone").val(inputValue); //correct value entered to your input.
inputValue = getInputValue();//get value again, becuase it changed, this one using for changing color of input border
if ((inputValue > 2000000000) && (inputValue < 9999999999))
$("#phone").css("border","black solid 1px");//if it is valid phone number than border will be black.
else
$("#phone").css("border","red solid 1px");//if it is invalid phone number than border will be red.
);
function getInputValue()
var inputValue = $("#phone").val().replace(/\D/g,''); //remove all non numeric character
if (inputValue.charAt(0) == 1) // if first character is 1 than remove it.
var inputValue = inputValue.substring(1, inputValue.length);
return inputValue;
【讨论】：
【参考方案13】：/^1?\s?(\([0-9]3\)[- ]?|[0-9]3[- ]?)[0-9]3[- ]?[0-9]4$/
这将验证所有美国风格的数字，带或不带 1，以及带或不带括号的区号（但如果使用，请正确使用。IE（902-455-4555 将不起作用，因为没有右括号。如果需要，它还允许 - 或集合之间的空格。）它将适用于 op 提供的示例。
【讨论】：
【参考方案14】：function phonenumber(inputtxt)
var phoneno = /^\(?([0-9]3)\)?[-. ]?([0-9]3)[-. ]?([0-9]4)$/;
if(inputtxt.value.match(phoneno))
return true;
else
alert("message");
return false;
【讨论】：
请添加一些描述来解释您的代码。【参考方案15】：function validatePhone(inputtxt)
var phoneno = /^\(?([0-9]3)\)?[-. ]?([0-9]3)[-. ]?([0-9]4)$/;
return phoneno.test(inputtxt)
【讨论】：
以上是关于使用 javascript 验证电话号码的主要内容，如果未能解决你的问题，请参考以下文章