在 html5 中构建表单时如何显示警告标志？答案

【问题标题】：How to show a warning sign while building a form in html5?在 html5 中构建表单时如何显示警告标志？
【发布时间】：2019-09-24 15:26:27
【问题描述】：

我有一个如下所示的表单，其中我放置了一个alt text，它将显示在网页上。

<form action="/action_page.php">
  Alt <input type="text" name="e1_alt" required>
  <input type="submit">
</form>

这里的表格不会保存，因为我已经使用了其中的必填字段。我想要实现的是，如果它是空的，应该显示一个警告标志，但它不应该阻止用户保存它。

问题说明：我想知道我应该对上面的 HTML 代码或 JavaScript 代码进行哪些更改，以便在出现警告时显示警告标志是空的但它不应该阻止用户保存它。

【问题讨论】：

【解决方案1】：

你不能真正纯粹地在 HTML 中做到这一点。 Javascript 需要处理验证。如果您的必填字段为空，则 HTML5 表单将不会提交，因为这是浏览器处理它们的方式。您可以将 novalidate 作为属性添加到表单中，但您仍然需要一些 javascript 来处理显示“警告标志”

这是一个有效的fiddle，向您展示如何使用 JS 来显示警告：

$('[name="e1_alt"]').blur(function(e) {
    var value = $(e.currentTarget).val();

  if (value.length === 0) {
    $('.error').show();
  }
});

【讨论】：