Can I use regexes containing ampersands in HTML5 pattern attributes?

Question

I use the following email validation before submission of a form in an HTML5 webapp:

<input id="mail" name="mail" type="email" value="" required  placeholder="Email" 
pattern="[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?"> 

However, the ampersands in the regex seem to invalidate the HTML. Checking at http://validator.w3.org/ I get the following error message:

& did not start a character reference. 
(& probably should have been escaped as &.)

Is it even possible to escape ampersands in the regex without messing it up? Is the validator right in this case?

Answer 1

You can, for example, use the hex value: \x26

See here: http://regex101.com/r/bF4bZ3

In other words, [....$%&'*....] would become [....$%\x26'*....]. Do the same for the rest.