Javascript：检查类是否更改为必需的字段输入而不是输入

我试图捕获用户是否未正确填写表单，并且应用程序向用户显示错误消息。应用程序更改所有必填字段的class属性

当我将click事件附加到submit上时，我无法获得错误，因为用户单击submit后页面会刷新。因此，我将代码放入settimeout，并在几个超时（500、1000、3000毫秒）下对其进行测试。我没有成功，请执行以下操作：

我的HTML：

错误：您必须输入一个值

我的Javascript：

setTimeout(
函数（）{
var errors=document.querySelectorAll（'[class*=“error”]'）；
如果（errors.length==0）{
警报（“无错误”）；
}
如果（errors.length>0）{
警报（“错误”）；
}
}, 3000
);

IMO，在这种情况下，最好避免默认提交行为，并添加一个侦听器，该侦听器将在单击时验证输入，如果全部正确，将调用相应的函数。

---

如果没有，请适当地更改类。

我认为我们可以将函数放在click事件处理程序中检查错误是否存在，如果错误存在，我们可以使用e.preventDefault（）取消click事件

像这样的

<form>
    <input type="text" id="input-email" class="input-email" name="email">
    <button type="submit" onClick="SubmitClick()">Submit</button>
</form>

---

我们是否可以使用

按钮

类型而不是

提交

？我认为这应该解决问题。或者，您必须使用

preventDefault

@MilindAgrawal单击

submit

按钮后手动阻止刷新，我只想指出，按钮的“type”属性的默认值为“submit”（IE除外），因此与之间没有区别。。。也许是这样，你的意思是，但如果你使用，你需要显式地调用submit函数。您可以显式调用它，也可以防止submit的默认行为。

 function SubmitClick(event) {
     var input = document.getElementById("input-email").value;

     if (input == "") 
     {
         alert('error !!!. name can not be empty');
         event.preventDefault();
     }
 }