为什么我得到："Invalid regular expression. Uncaught SyntaxError. Invalid escape."？

Question

我正在尝试创建一个 html 输入标签，它只接受以 2 种格式之一输入的数字，并拒绝所有其他输入。

我只想接受这些格式的数字，包括需要破折号：

1234-12

和

1234-12-12

注意：这不是日期，而是合法的章节编号

我正在阅读的关于正则表达式的所有内容都说以下内容应该有效，但事实并非如此。

<input class="form-control"
                       type="text"
                       pattern="^(\d{4}\-\d{2}\-\d{2})|(\d{4}\-\d{2})$"
                       required />

Chrome 中的 Devtools 控制台错误：

Pattern attribute value ^(\d{4}\-\d{2}\-\d{2})|(\d{4}\-\d{2})$ is not a valid regular expression: Uncaught SyntaxError: Invalid regular expression: /^(\d{4}-\d{2}-\d{2})|(\d{4}-\d{2})$/: Invalid escape

Answer 1

在 ES6 正则表达式中，您不应该在字符 class 之外转义连字符 并与 u 标志一起使用（[= Chrome 和 FF 的当前版本中的 12=] 正则表达式。

此外，模式属性中的正则表达式默认锚定，删除冗余 ^ 和 $ 并使用可选组缩短模式

pattern="\d{4}-\d{2}(-\d{2})?"

HTML5 pattern 属性中的这个正则表达式表示：

\d{4}-\d{2} - 匹配 4 位数字，-，然后从字符串开头匹配 2 位数字

(-\d{2})? - 并且可以选择匹配 - 然后是字符串末尾的 2 位数字。

为什么我得到："Invalid regular expression. Uncaught SyntaxError. Invalid escape."？

Why and I getting: "Invalid regular expression. Uncaught SyntaxError. Invalid escape."?

regex

syntax-error