使用仅触发手机键盘，不校验格式；严格限制国内11位手机号需组合pattern="^1[3-9]\d{9}$"、maxlength="11"、required和inputmode="numeric"，并辅以后端验证与实时JS校验。
直接用 input type="tel" 本身**不校验格式**，仅触发手机键盘；要严格限制国内 11 位手机号，必须配合 pattern、maxlength 和 required，并注意正则的准确性与兼容性。
✅ 正确的 pattern 正则表达式
国内手机号以 1 开头，第二位是 3–9（排除 11、12 等无效号段），后接 9 位数字。推荐使用：
pattern="^1[3-9]\d{9}$"
-
^和$强制整串匹配，防止输入多余字符（如空格、+86） -
1[3-9]匹配 13–19 开头（覆盖所有现网主流号段，含 13/14/15/17/18/19） -
\d{9}精确匹配后续 9 位数字，总长刚好 11 位 - 避免用
[0-9]或.*，易被绕过；不用\b（HTML pattern 不支持单词边界）
✅ 必须搭配的 HTML 属性
仅靠 pattern 不够，需组合使用：
htmlppt.skill
下载
把任意文章或文档内容转换成精美的全屏翻页 HTML 演示文件（幻灯片风格）。当用户发来一篇文章、文档链接、Markdown 内容、或粘贴的文本，并且希望生成演示用的 HTML 时触发。支持任意内容来源：iWiki 链接、KM 链接、本地文件路径、直接粘贴的文本。生成的 HTML 文件保存到本地工作区，并通过企微直接发送给用户。触发词示例：帮我把这篇文章做成PPT、转成演示文档、生成HTML幻灯片、做个演示、转成可以演示的格式、article to deck、make a slide。
-
maxlength="11"：物理限制输入长度，防粘贴超长号码 -
required：确保必填（否则 pattern 不触发） -
inputmode="numeric"：在支持的浏览器中强制数字键盘（比type="tel"更可靠） - 去掉
type="number"：它会允许小数点和负号，且自动过滤非数字字符，破坏用户体验
完整写法示例：
⚠️ 注意前端校验的局限性
pattern 是**表单提交时的客户端校验**，仅用于提示，不能替代后端验证：
- 用户可禁用 JS 或修改 DOM 绕过 pattern
- 部分旧 Android 浏览器对 pattern 支持弱（建议降级 fallback：用 JS 监听
input实时校验） - 不验证号码是否真实存在、是否已停机、是否为虚拟运营商号（这些需服务端调用运营商接口或三要素认证）
? 增强体验的小技巧
- 监听
input事件，实时删除非数字字符：value = value.replace(/\D/g, '')，再截取前 11 位 - 输入满 11 位后自动聚焦下一个字段（如验证码框）
- 提交失败时，用
setCustomValidity()提供中文提示，避免英文默认文案 - 不要用 onkeypress 拦截 —— 会阻止粘贴、语音输入等现代操作
