Почему и я получаю: «Недопустимое регулярное выражение. Неиспользуемый SyntaxError. Invalid escape.»?

Question

Im пытается создать тег ввода html, который принимает только числа, введенные в 1 из 2 форматов, и отклоняет все другие входные данные.

Я хочу принять номера только в этих форматах, в том числе требующих черточки:

1234-12 

и

1234-12-12 

Примечание: это не даты, а юридические номера глав

Все, что я читаю о регулярном выражении, говорит, что следующее должно работать, но это не так.

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

Devtools Консоль ошибок в Chrome:

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 регулярное выражение используется с u флагом (который используется по умолчанию в pattern регулярных выражений в текущие версии Chrome и FF).

Кроме того, регулярное выражение в атрибуте шаблона закреплено по умолчанию, удалить redudant ^ и $ и сократить шаблон с помощью дополнительных групп

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

Это регулярное выражение в атрибуте HTML5 pattern означает:

• \d{4}-\d{2} - матч 4 цифры, -, а затем 2 цифры от начала строки
• (-\d{2})? - и необязательно совпадают -, а затем 2 цифры в конце строки.