regex - 为什么和我得到: “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

您不应该在与u标志一起使用的ES6正则表达式中的字符类之外转义连字符(在当前版本的Chrome和FF中，pattern正则表达式中默认使用的连字符)。

此外，默认情况下，pattern属性中的正则表达式是 anchor 定的，删除多余的^和$并通过使用可选组来缩短模式

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

HTML5 pattern属性中的此正则表达式表示:

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

开头的2位数字

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