Question

我正在尝试拦截提交表单以更改keywords标签的值。

我有以下代码：

<HTML>
<FORM name="searchForm" method="get" action="tmp.html" >
<input type="text" name="keywords" />
<input type="button" name="submit" value="submit" onclick="formIntercept();"/>
</FORM>
<SCRIPT language="JavaScript">
document.searchForm.keywords.focus();
function formIntercept( ) {
    var f = document.forms['searchForm'];
    f.keywords.value = 'boo';
    f.submit();
};
</SCRIPT>
</HTML>

当我在Chrome中运行此功能并点击提交按钮时，关键字标签会更改为boo，但javascript控制台会显示：

 Uncaught TypeError: Property 'submit' of object <#an HtmlFormElement> is not a function.

如何使用操纵的关键字提交表单？

Answer 1

尝试呼叫form.submit()时出错的原因是您的提交按钮名为“提交”。这意味着Form对象的“submit”属性现在是对提交按钮的引用，覆盖了表单原型的“submit”方法。

重命名提交按钮可以让您无误地调用submit()方法。

Answer 2

问题是，当某个元素为<input type="submit" name="submit" />时，submit（）方法将无效。这种情况的最佳解决方案是将提交类型输入的名称更改为其他名称，例如按钮提交等。

Answer 3

<html>
<head></head>
<body>
<form name="searchForm" method="get" action="tmp.html" onsubmit="formIntercept(this);">
<input type="text" name="keywords" />
<input type="submit" name="submit" value="submit"/>
</form>
<script type="text/javascript">
document.searchForm.keywords.focus();
function formIntercept( form ) {
    form.keywords.value = 'boo';
    //form.submit();
}
</script>
</body>
</html>

Answer 4

请参阅jQuery .submit()。

$("form").submit( function() {
   // TODO tweak your form data before it gets sent
});

Answer 5

只需更改提交按钮的名称即可使用！

Answer 6

Chris Butler 很好地解释了这个问题。

您可以使用HTMLFormElement的原生提交方法来解决问题。在你的情况下：

function formIntercept( ) {
    var f = document.forms['searchForm'];
    f.keywords.value = 'boo';
    HTMLFormElement.prototype.submit.call(f);
};

Answer 7

发现这非常有用，错误是由重命名document.getElementById('myform').submit()工作后的名称=提交的表单中的另一个元素引起的

在用javascript截取提交后，无法“提交（）`html表单

7 个答案: