必须用 javascript 的 setcustomvalidity() 配合 oninvalid/oninput 事件才能自定义 pattern 验证提示；oninvalid 中设提示，oninput 中清空（setcustomvalidity("")），否则错误状态将永久残留导致无法提交。
浏览器对 pattern 验证失败时默认只显示“请与所请求的格式保持一致”这类模糊提示，无法直接通过 HTML 属性改写。必须用 JavaScript 拦截校验逻辑，靠 setCustomValidity() 才能输出明确的中文提示。
oninvalid 事件里调用 setCustomValidity() 是最简方案
在 input 元素上直接绑定 oninvalid，触发时调用 this.setCustomValidity("提示文字") 即可覆盖默认文案。但要注意：这个设置是“一次性”的，不手动清空会导致后续合法输入仍被标记为 invalid。
-
oninvalid只在提交时（或显式调用reportValidity()）触发，不是实时的 - 必须搭配
oninput或onchange清空错误状态：this.setCustomValidity("") - 示例写法：
<input type="text" pattern="^1[3-9]\d{9}$" oninvalid="this.setCustomValidity('请输入正确的11位手机号')" oninput="this.setCustomValidity('')">
监听 invalid 事件并 preventDefault() 更可控
用 addEventListener('invalid', ...) 可以精确判断出错类型（比如是空值还是正则不匹配），再针对性提示。默认气泡会干扰 UI 布局，所以得先 e.preventDefault() 拦掉。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 检查
input.validity.valueMissing判断是否为空，input.validity.patternMismatch判断是否正则失败 - 不要只在
invalid里设提示，也得在input或blur里重置：input.setCustomValidity("") - 避免漏掉
customError状态残留：只要调过setCustomValidity("xxx")，之后所有验证结果都会被它覆盖，必须清空才能恢复原生逻辑
为什么不能只靠 title 属性？
title 属性只是 tooltip，不是验证失败提示——它只在鼠标悬停时显示，且不会在表单提交校验失败时自动弹出。很多人误以为加了 title="请输入手机号" 就能替代 oninvalid，实际完全无效。
-
title和pattern是两套机制，互不影响 - 某些老版本 Safari 会把
title当作失败提示，但这是非标准行为，不可依赖 - 真正起作用的只有
setCustomValidity()+ 事件监听组合
最关键的细节是：每次合法输入后必须调一次 setCustomValidity("")，否则错误状态会卡死。这个动作容易被忽略，但一旦漏掉，用户就再也无法提交表单——哪怕输对了也不行。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
