Regex Chrome中的正则表达式表单验证

我有一个web表单，它曾经工作过，但突然间它在Chrome中不再工作了。这些模式通过了regex101.com的测试，表单可以通过Firefox提交，但是Chrome不再喜欢它了。最令人困惑的是，它在不同的点上都失败了，即使形式没有改变。（例如，有时名字不起作用，有时姓氏不起作用——尽管模式相同。有时会归结为电话号码或URL。无法想象为什么。）我已经尽我所能分析了它-有什么建议吗

<form name="form-careers" enctype="multipart/form-data" action="/careers/#form" method="POST">

<div class="form_labels">
    <p><label for="fname">First Name:</label></p>
</div>
<div class="form_inputs">
    <p><input type="text" name="fname" id="fname" placeholder="*" pattern="/^([A-Za-z-\ \.]+)$/" value="<?php if (isset($fname)) { echo $fname; } ?>" required /></p>
    <div class="error" id="error-fname"><?php if (isset($err_fname)) { echo $err_fname; } ?><?php if (isset($err_fname2)) { echo $err_fname2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="lname">Last Name:</label></p>
</div>
<div class="form_inputs">
    <p><input type="text" name="lname" id="lname" placeholder="*" pattern="/^([A-Za-z-\ \.]+)$/" value="<?php if (isset($lname)) { echo $lname; } ?>" required /></p>
    <div class="error" id="error-lname"><?php if (isset($err_lname)) { echo $err_lname; } ?><?php if (isset($err_lname2)) { echo $err_lname2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="email">Email:</label></p>
</div>
<div class="form_inputs">
    <p><input type="email" name="email" id="email" placeholder="*" pattern="/^([\dA-Za-z0-9\._-]+)@([\dA-Za-z0-9\._-]+)\.([A-Za-z]{2,10})$/" value="<?php if (isset($email)) { echo $email; } ?>" required /></p>
    <div class="error" id="error-email"><?php if (isset($err_email)) { echo $err_email; } ?><?php if (isset($err_email2)) { echo $err_email2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="phone">Phone:</label></p>
</div>
<div class="form_inputs">
    <p><input type="tel" name="phone" id="phone" placeholder="* (###-###-####)" pattern="/^([\d]{3})\-([\d]{3})\-([\d]{4})$/" value="<?php if (isset($phone)) { echo $phone; } ?>" required /></p>
    <div class="error" id="error-phone"><?php if (isset($err_phone)) { echo $err_phone; } ?><?php if (isset($err_phone2)) { echo $err_phone2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="role">Desired Role:</label></p>
</div>
<div class="form_inputs">
    <p><input type="text" name="role" id="role" placeholder="*" pattern="/^([\\\/A-Za-z-\ \.]+)$/" value="<?php if (isset($role)) { echo $role; } ?>" required /></p>
    <div class="error" id="error-role"><?php if (isset($err_role)) { echo $err_role; } ?><?php if (isset($err_role2)) { echo $err_role2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="portfolio">Portfolio/Website:</label></p>
</div>
<div class="form_inputs">
    <p><input type="url" name="portfolio" id="portfolio" placeholder="(http://...)" pattern="/^(https?:\/\/)?([\dA-Za-z\.-]+)\.([A-Za-z\.]{2,6})([\/\w \.-]*)*\/?$/" value="<?php if (isset($portfolio)) { echo $portfolio; } ?>" required /></p>
    <div class="error" id="error-portfolio"><?php if (isset($err_portfolio)) { echo $err_portfolio; } ?><?php if (isset($err_portfolio2)) { echo $err_portfolio2; } ?></div>
</div>

<div class="form_labels">
    <p><label for="resume">Upload Resume: (optional)</label></p>
</div>
<div class="form_inputs">
    <p><input type="file" name="resume" id="resume" accept=".pdf, .txt, .rtf, .doc, .docx" style="margin-bottom:2px;"/>
    <span style="color:#777;">(pdf, txt, rtf, doc, docx)</span></p>
</div>

<input type="hidden" name="formtype" id="formtype" value="careers">

<div class="form_labels submit">
    <p>&nbsp;</p>
</div>
<div class="form_inputs">
    <a href="javascript:void(0);"><input type="submit" value="Submit" name="action" class="button-red" ></a>
</div>

名字：

我没有一个好的答案，因为我看不出代码有什么问题。应该没有/斜线，但从评论中我想你已经知道了

我要提供的是一个小的javascript选项，用于不支持atribute的浏览器。而且是铬合金的。希望这对你有帮助

if ( ! input.hasOwnProperty('pattern') && ~input.value.search(input.pattern)) {
// Valid input field for browsers which don't support `pattern` attribute.
}

这是一个JS

还有一个小建议，不要只测试客户端的输入。这对于向用户反馈很有用，但不要依赖服务器端正确的输入。（但我想你可能已经知道了）
也有同样的问题。我可能会发疯，但我很确定，在过去的几天里，带有模式的it输入验证刚刚停止在chrome上工作。但是，我不相信chrome会在我们不知情的情况下自动更新。你在DevTools控制台中看到任何警告吗？控制台中没有任何警告…它不应该是
pattern=“^（[A-Za-z-\\.]+）$”
而不是regex周围的
/
s吗？您也可以将其编写为
pattern=“[A-Za-z.-]+”
，因为模式在默认情况下是锚定的，并且不需要在这些位置转义连字符和点。我最初拥有的所有模式在正则表达式周围都没有斜杠，并且根据另一篇文章的建议，在出现此问题时添加了它们。但模式是否包含在斜杠中似乎并不重要——它只是在另一个地方失败。仍然困惑。。。