为什么onclick()在表单提交之前被调用?

Why does `onclick()` get called before form submission?

本文关键字：调用 表单提交 onclick 为什么      更新时间：2023-09-26

我有一个通过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正在被执行，然后只有表单post发生，因此在onclick之后从未找到elem2。

表单提交为:

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

现在我该怎么做才能在表单提交后调用onclick，并且错误字段已经呈现在页面上?

您使用图像作为输入类型。输入类型没有图像类型。而不是使用type="button"。在validate方法中调用submit form

当表单提交结束时，基本上你会有一个页面刷新。因此DOM从一开始就被重新构造。在提交操作之前初始化的任何javascript变量现在都将被重置。

做你想做的事很简单。你可以这样做

<input id="mysubmit" type="image" name="submit" onclick = 'checkErrors()'>
方法1(纯javascript): 
<body onload="document.getElementById('mysubmit').click(); return false;">

方法二(JQuery):

$( document ).ready(function() {
    $('#mysubmit').click();
});
相关文章：