HTML表单pattern属性不支持反向引用等高级正则，无法检测重复字符；须用JavaScript的test()配合input事件实时验证：相邻重复用/(.)
/，任意重复用/(.).
/，无重复用^(?!(.)(.).).$/。

HTML表单里不能直接用正则匹配重复字符

HTML的 pattern 属性只支持基础正则（ECMAScript 262 的子集），不支持反向引用（如 (.)
）或负向先行断言（如 (?!.*(.).*
)），所以无法用纯 pattern 检查“有无相邻/任意位置重复字符”。浏览器会静默忽略非法语法，或报错但不提示——你写的 pattern="(.)
" 实际不会生效。

用 JavaScript 的 test() 配合 input 事件实时检测

这是最可控、可调试的方式。关键点在于：必须用带全局标志的正则来扫描所有重复，且要区分“相邻重复”和“任意位置重复”：

• 检测相邻重复（如 "aa"、"11"）：/(.)
/.test(value)
• 检测任意位置重复（如 "aba"、"101"）：/(.).*
/.test(value)
• 检测「无重复字符」（即全部唯一）：^(?!(.*)(.).*).*$（注意：需在 JS 中使用 new RegExp() 或字面量，且 ^/$ 必须显式写出）
• 避免误判空字符串或单字符：value.length 时可跳过校验

input 事件中调用 setCustomValidity() 控制提示

不要依赖 pattern 的默认行为。手动控制校验反馈更可靠：

const input = document.querySelector('input[name="code"]');
input.addEventListener('input', () => {
  const v = input.value;
  if (v.length < 2) {
    input.setCustomValidity('');
    return;
  }
  // 允许「无重复字符」
  const hasDup = /(.).*
/.test(v);
  input.setCustomValidity(hasDup ? '不能包含重复字符' : '');
});

注意：setCustomValidity('') 是清除错误状态的必要操作，漏掉会导致后续输入一直报错；reportValidity() 只在提交时自动触发，无需手动调。

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

立即学习“前端免费学习笔记（深入）”；

服务端必须重做校验，前端只是体验优化

JS 校验可以被绕过（禁用 JS、改 DOM、抓包重发）。如果业务要求强一致性（如密码、邀请码、用户名去重），后端必须用对应语言的完整正则引擎重新验证，例如：

• Python：re.search(r'(.).*
', value)
• Go：regexp.MatchString(`(.).*
`, value)
• Java：Pattern.compile("(.).*\1").matcher(value).find()

正则本身没问题，但不同语言对 Unicode 字符（如中文、emoji）的点号 . 匹配行为可能不同，测试时务必覆盖多字节字符场景。