使用Javascript提交表单无法正常工作

Question

我有一个简单的上传文件表单。如果我使用普通的提交按钮，一切都按预期工作：

<form id="mainform" method="post" action="/" enctype="multipart/form-data">
...
<input type="submit" id="submit" value="Analyze File"/>
</form>

但是，如果我将其更改为普通按钮并使用JavaScript提交表单，则不会发生任何事情：

<input type="button" id="submit" value="Analyze File" onclick="document.getElementById('mainform').submit()"/>

我验证了onclick处理程序确实被调用，并且查找表单的操作是正确的。例如，如果我将其更改为onclick="alert(document.getElementById('mainform').action)"，则警报会按预期弹出并显示表单的目标URL。但由于某种原因，submit()的调用仅仅不能提交表单。

- peastman

---

@kol：w3schools不是JavaScript代码的好来源。此外，他的代码与那个有什么不同？他基本上做了同样的事情。 - gen_Eric

Answer 1

问题出在你的"submit"按钮上。它的id是"submit"，这意味着“document.getElementById（“mainform”）。submit”表示具有ID为“submit”的按钮，而不是"submit"函数。

你只需要更改该按钮的ID，就可以解决问题了。

- Joe Enos

Answer 2

您在 .submit() 方法和以下内容之间存在名称冲突：

<input type="submit" id="submit" value="Analyze File"/>

通过拥有那个“id”，将其引用分配给<form>的submit属性，从而替换方法。

如果您重命名<input>，则应该能够按预期使用.submit()：

<input type="submit" id="mainform_submit" value="Analyze File"/>

- Jonathan Lonowski