Question

是否可以验证电话号码，但如果留空则不需要相同的电话号码？

如果输入为空 - 表单应提交
如果输入了电话号码，则其要求为10位。
如果与10位数字格式不匹配 - 表格应不提交

请指教，谢谢

Answer 1

如果您使用required属性，则游戏结束。所以不要。

要求它是10位

使用^\d{10}$模式：

＆＃13;

input[type=text]:invalid{
  border: 1px solid red;
}

＆＃13;

<form>
  <input type="text" pattern="^\d{10}$" />
  <button>SUBMIT</button>
</form>

＆＃13;

如果

，表单不会提交

某些值 AND 该值与pattern中的正则表达式不匹配。

表单提交，如果

没有价值
其值 AND 正好有10位

Answer 2

您可以使用正则表达式匹配大多数电话号码或空字符串。

＆＃13;

var pat = /^$|^(\+\d{1,2}\s)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/
console.log(pat.test(''))
console.log(pat.test('8169428451'))
console.log(pat.test('(816)842-8455'))
console.log(pat.test('asdfs'))

＆＃13;

function check(){
var pat = /^$|^(\+\d{1,2}\s)?\(?\d{3}\)?[\s.-]?\d{3}[\s.-]?\d{4}$/
var phone = document.getElementById('phone')
if(pat.test(phone.value))
{
document.getElementById("myForm").submit();
}
else
{
return false
}
}

＆＃13;

<form id="myForm">
  <input id="phone" type="text" />
  <button onclick="check(); return false;">Go</button>
</form>

＆＃13;

验证不需要的输入

2 个答案: