当表单无效时，防止浏览器要求保存登录信息

Question

我有一个简单的登录表单，其中包含用于前端验证的绝对基础知识。它只检查字段是否为空，并且电子邮件是最基本的正确格式。当表单无效时，我会阻止submit行为。

当我在两个字段中输入内容以使它们不是空白，但电子邮件仍然无效时，表单未提交，但浏览器仍然提示我保存我的凭据。

如果表单无效且尚未提交，我该如何防止这种情况发生？我仍然希望向用户提供此功能，但仅限于实际提交表单时。

以下是我如何设置的基础知识：

HTML：

<form method="post" action="" onsubmit="return validateForm()" novalidate>
  <input type="text" id="email" required autofocus>
  <input type="password" id="password" required>
</form>

JS：

function validateForm() {
  var isValid = true;

  //validation logic goes here...

  return isValid;
}

这是一个有效的演示：https://codepen.io/chrismbarr/pen/awmVyq 在密码字段中输入无效的电子邮件和内容以触发此操作。