onsubmit() 不起作用答案

【问题标题】：onsubmit() does not workonsubmit() 不起作用
【发布时间】：2011-02-01 00:58:41
【问题描述】：

这是我觉得令人不安的事情。我创建了一个小表单，我正在使用 AJAX 为我进行验证。我有一个 JavaScript 函数 authenticate()，有时可以工作。

<form method="post" action="" id="login_form" onsubmit="authenticate()";>

// various inputs

<input type="button" onclick="authenticate()" value="Log In">

</form>

authenticate() 在我单击按钮时工作得很好。但是，如果我按 Enter 键，则表单是 submitted，它会失败。如果我调用 onSubmit() 也会失败。在我的调试中，我提醒传出的文本——它们是相同的。然而，Prototype Ajax 函数将其称为 onSuccess，但只是没有来自服务器的响应。（服务器输出“成功”或“失败”）。

为什么 onClick() 和 onSubmit() 的行为不同？调用完全相同的函数，但结果不同。

任何帮助将不胜感激。

--戴夫

【问题讨论】：

authenticate() 的预期副作用是什么？您是否打算将表单回发到当前页面 URL？
您正在使用 Prototype 进行 Ajax 调用，为什么不用于事件处理？摆脱那些旧的内联内容并在表单上使用现代 DOM 事件处理程序。

标签： javascript forms

【解决方案1】：

按钮的onClick 不提交表单。它只是一个在客户端调用authenticate()的按钮。

您的onSubmit 事件将在表单提交时被调用，但您可能看不到客户端authenticate() 的结果，因为表单将在之后立即发布。不清楚是什么功能。

但是，如果authenticate() 符合我的猜测，那么您需要将属性更改为onSubmit='return authenticate()' 并让函数返回真/假。为 false 时，表单提交将被中止。

【讨论】：

"...表单将在...之后立即发布" 我想我明白现在发生了什么。我其实不想提交，但我喜欢表单的行为，Prototype 为表单提供了一个不错的序列化功能。谢谢！
我们可以先通过按钮的“onclick”功能来验证表单，一旦验证通过就可以提交表单。所以我们不需要使用 submit() 函数。