如何在表单中验证电话号码：JavaScript

Question

我正在用NodeJS和express构建一个Web应用程序。我有一个在提交时提交POST请求的表单。我如何验证“电话”输入，以便电话号码为10位数字。

<form action="/books" method="POST" enctype="multipart/form-data">

   <input class="form-control" type="text" name="user[name]" placeholder="name" required>

   <input class="form-control" type="number" name="user[phone]" placeholder="phone" required>

   <button>Submit</button>

</form>

如果电话号码无效，则用户不得提交。

任何帮助都非常感谢

Answer 1

下面是一个代码片段，用于演示如何使用处理程序验证表单。通常，您会通过调用 向用户输出一条消息。但是，由于这些代码片段不支持此功能，因此我改用了调用。onsubmitalertconsole.log我还使用了一种验证技术，允许您使用常规输入字段，该字段将允许用户输入非数字字符并验证位数是否为10，以便用户可以输入例如：[phone]。当然，它仍然适用于只允许数字的字段。function validateForm(){&nbsp; &nbsp; let phone = document.f['user[phone]'].value;&nbsp; &nbsp; phone = phone.replace(/\D/g, ''); // get rid of all non-digits&nbsp; &nbsp; if (phone.length == 10) {&nbsp; &nbsp; &nbsp; &nbsp; return true;&nbsp; &nbsp; }&nbsp; &nbsp; //alert('Invalid phone number');&nbsp; &nbsp; console.log("Invalid phone number."); // alert not supported in code snippet&nbsp; &nbsp; return false;}<form name="f" action="/books" method="POST" enctype="multipart/form-data" onsubmit="return validateForm();">&nbsp; &nbsp;<input class="form-control" type="text" name="user[name]" placeholder="name" required>&nbsp; &nbsp;<input class="form-control" type="number" name="user[phone]" placeholder="phone" required>&nbsp; &nbsp;<button type="submit">Submit</button></form>

Answer 2

您是否尝试过此代码：function phonenumber(inputtxt) {&nbsp; var phoneno = /^\d{10}$/;&nbsp; if((inputtxt.value.match(phoneno)) {&nbsp; &nbsp; &nbsp; return true;&nbsp; &nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; alert("message");&nbsp; &nbsp; &nbsp; &nbsp; return false;&nbsp; &nbsp; &nbsp; &nbsp; }}上述代码的完整详细信息取自&nbsp;W3Resource下面是一个 JSfiddle 页面，其中包含它应该是什么样子的示例：https://jsfiddle.net/khaderhan/5phbg26n/15