无法获取type =“ email”中的输入正则表达式模式以正常工作

我使用以下正则表达式模式来验证JavaScript中的电子邮件地址：

/^("?)(?:[A-Z0-9_%+-]\.?)+[A-Z0-9_%+-]\1@(?:(?:(?:[A-Z0-9](?:[A-Z0-9-]*[A-Z0-9])?\.)+[A-Z]{2,})|(?:(?:[0-9]{3}\.){3}[0-9]{3})|(?:\[(?:[0-9]{3}\.){3}[0-9]{3}\]))$/i.test(email);

I've been attempting to use the HTML5 pattern prop to validate against this pattern, but I can't seem to get it to work correctly.

我尝试过相同的模式，但似乎无法正常工作。

<form>
  <label for="email">Enter your email:</label>
  <input type="email" id="email" name="email" pattern='/^("?)(?:[A-Z0-9_%+-]\.?)+[A-Z0-9_%+-]\1@(?:(?:(?:[A-Z0-9](?:[A-Z0-9-]*[A-Z0-9])?\.)+[A-Z]{2,})|(?:(?:[0-9]{3}\.){3}[0-9]{3})|(?:\[(?:[0-9]{3}\.){3}[0-9]{3}\]))$/'>
  <input type="submit">
</form>

当前，任何电子邮件地址都会导致错误的模式匹配。我是否需要以其他方式设置正则表达式格式以支持此格式？