javascript - 为什么 `onclick()`在表单提交之前被调用？

Question

我有一个通过 submit 提交的表单按钮。单击它时，它将执行 Java 脚本验证并在文本框下显示错误字段。因此，如果出现错误，控件将返回到同一页面。我的问题是，在表单发布后，我不断看到两个错误字段，我需要删除一个并只保留一个。

为此，我从提交按钮调用了一个点击函数，我试图找出错误 div id 是否存在，如下所示:

<input type="image" name="submit" onclick = 'checkErrors()'>

现在在 checkErrors() 内方法:

function checkErrors(){
var errorElem1 = document.getElementById('errField1');
var errorElem2 = document.getElementById('errField2');
if((errorElem1 != null) && (errorElem2 != null)){
alert("Two error fields.");
errorElem2.style.display='none';
}
}

现在，一旦我点击按钮，我就找不到警报了。

所以我删除了 if 条件并将其保留为:

 function checkErrors(){
var errorElem1 = document.getElementById('errField1');
var errorElem2 = document.getElementById('errField2');
errorElem2.style.display='none';
}
} 

现在，我在 Firebug 控制台中看到错误:elem2 is null 。这意味着onclick正在执行，然后只发生表单发布，因此 elem2 onclick 之后就再也找不到了。

表单提交方式为:

<form name="IntitalJspPage" method="post" action="Controller" onsubmit="validate(this); return false;">

现在我可以在这里做什么来在提交表单并且错误字段已呈现在页面上后调用 onclick ？

Answer 1

您使用图像作为输入类型。输入类型没有图像类型。而不是使用 type="button"。改为在 validate 方法中调用提交表单。