javascript - JavaScript 验证表单不会因错误而停止

Question

我正在制作简单的 html 表单并使用 javascript 进行验证。但我的表单并没有因错误而停止...

if(document.register.fname.value=="")
{

alert("plz enter username");
document.register.fname.focus();
alert("plz enter username");
return false;
}

Html 部分是....

<input type="image" src="img/signup.PNG" alt="Sign Up" value="signup" onsubmit="return regis()" />

即使我留下空白，它也会在另一页上......请帮助我，这是什么错误？

Answer 1

onsubmit仅适用于form元素，不适用于input元素。将您的onsubmit内联处理程序放在form元素中。

更好的选择是使用addEventListener如下：

document.register.addEventListener('submit', function(e) {
  if(document.register.fname.value === "")
  {
    alert("plz enter username");
    document.register.fname.focus();
    e.preventDefault();
  }
});

Answer 2

您需要将属性onsubmit="return regis()"放入form表单的标签中。

像这样

<form onsubmit="return regis()" ...

Answer 3

您应该将验证 javascript 放在您的表单上，如下所示：

<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">

如果您想验证何时按下提交按钮，请尝试以下操作：

<input type="submit" value="Submit this form" onclick="validateForm('myForm');return false;" />