HTML 表单未通过验证答案

【问题标题】：HTML form doesn't get validatedHTML 表单未通过验证
【发布时间】：2019-02-23 09:57:17
【问题描述】：

我正在努力验证一个简单的表单，但我不知道出了什么问题。这是一个不验证的简单示例：

<form name="loginForm">
  <input type="email" name="email" id="email" required/>
  <input type="submit" value="save" />
</form>

【问题讨论】：

看这里：jasonwatmore.com/post/2018/05/10/… 也请在 .ts 中发布您使用的逻辑
您的代码运行良好，有什么问题？
确保不要忘记导入FormsModule。
HTML5 Email Input Pattern Attribute的可能重复

标签： html

【解决方案1】：

使用type="email" 将验证“a@b”，这当然是一个无效的电子邮件地址。

您可以使用模式来验证电子邮件地址，如下所示：

<form name="loginForm">
  <input type="email" name="email" id="email" required pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$"/>
  <input type="submit" value="save" />
</form>

【讨论】：

【解决方案2】：

您的代码似乎没问题。用你的代码。如果您想测试您的表单是否正常，您可以在正确提交表单后添加一个表单操作以重定向用户（使用 action = "newPage.html）：

<body>
<form id="loginForm" action="newPage.html">  
    Your mail:
    <input type="email" name="email" id="email" required/>

    <input type="submit" value="Save form" />
</form>

所以现在要进行测试，您必须使用所需的正文创建“newPage.html”文件：

<body>
   <p>good submit</p>
</body>

如果出现新页面，就可以提交了！

【讨论】：