input标签校验手机号

在HTML中，`<input>`标签用于获取用户的输入，如果要对手机号进行校验，可以利用JavaScript或者HTML5自带的表单验证功能。这里分别提供两种方法：

**1. HTML5内置验证：**
如果你的浏览器支持HTML5，可以直接在`<input>`标签上设置`type="tel"`并添加`pattern`属性来限制输入格式，例如：

<input type="tel" id="phone" name="phone" pattern="^\d{11}$" required>

这里`pattern`值`^\d{11}$`表示只能输入11位数字的手机号，`required`属性确保字段必填。

**2. JavaScript自定义验证：**
如果不使用HTML5特性，可以使用JavaScript来实时验证。比如在用户输入时，检查输入内容是否符合正则表达式：

<input type="text" id="phoneInput" oninput="validatePhoneNumber(this)">
<script>
function validatePhoneNumber(input) {
  const phoneNumber = input.value;
  const regex = /^\d{11}$/; // 或者使用上述更复杂版正则
  if (!regex.test(phoneNumber)) {
    alert('请输入11位数字的手机号');
    input.setCustomValidity('手机号格式错误');
  } else {
    input.setCustomValidity('');
  }
}
</script>

这里会在用户每输入一个字符后立即进行验证，如果不符合就显示警告提示。