未捕获的错误:document.myForm.submit(); 不是函数 - 在第二次调用之后

Question

如果我调用一次，自动提交document.myForm.submit();工作正常，但我尝试多次调用它，在第一次尝试后，其他时间会发出错误Uncaught Error: document.myForm.submit();代码 100% 正常工作，直到我多次调用。这正常吗？如何避免？

研究表明，我的表单输入很可能被命名为"提交"，但事实并非如此

我正在使用Phonegap/Cordova：

function sendData()//Gets called once per second
{
document.body.insertAdjacentHTML("afterend",
'<form name="myForm" action="http://www.mywebsite.com/formProcess.php" method="POST" target="submission.frame">' +
'<input type="text"   name = "uuid" value="' + String(uuid)  + '">' +
'<input type="text"   name = "directionX" value="' + String(directionX)  + '">' +
'<input type="text"   name = "directionY" value="' + String(directionY)  + '">' +
'<iframe name="submission.frame" hidden></iframe>'                                +
'</form>'
);
document.myForm.submit();
}

服务器 PHP

<?php
//Do bunch of stuff
?>
<form name="myForm" action="<?php echo $current_file; ?>" method="POST">
UUID       <input type="text" name="uuid">      <br>
directionX <input type="text" name="directionX"><br>
directionY <input type="text" name="directionY"><br>
<input type="submit" value="Send">
</form>

Answer 1

第一次调用它时，您将一个表单添加到文档中，然后document.myForm该表单元素。

第二次调用它时，您将另一个表单(具有相同的名称！)添加到文档中，然后document.myForm是一个包含两个表单的 HTML 元素集合(这是一个类似数组的对象)。

集合没有submit方法。它里面的两个元素确实如此。

您可以通过测试以查看是否存在提交方法，然后在失败时抓取集合中的最后一个元素来补偿这一点......

if (document.myForm.submit) {
document.myForm.submit();
} else {
document.myForm[document.myForm.length - 1].submit();
}

。但看起来你最好只是切换到使用XMLHttpRequest，而不是将表单和iframe扔到文档中。这些是我们在90年代后期为Outlook Web应用程序提出XMLHttpRequest之前Microsoft使用的。