JavaScript中的“提交不是函数”错误


263

谁能告诉我这段代码出了什么问题?我尝试使用JavaScript提交表单,但显示错误“ .submit不是函数”。请参阅以下代码的更多详细信息:

<form action="product.php" method="get" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input onclick="submitAction()" id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

我也尝试过这个:

<script type="text/javascript">
    function submitAction()
    {
        document.forms["frmProduct"].submit();
    }
</script>

两者都显示相同的错误:(


哪个浏览器给您此消息?您可以发布完整的源代码吗?
哈托

考虑到已发布的代码在IE7和Chrome2中都对我有效,那么也许您尚未发布的代码有问题?
Lasse V. Karlsen,2009年

11
也许您有一个具有名称或ID提交的字段,因此.submit()被该字段遮盖了?
拉瑟五世卡尔森

当您在不同的元素中具有相同的id =“ frmProduct”时,就会发生该错误。
Optimaz ID

Answers:


734

提交不是功能

表示您已将提交按钮或其他元素命名为submit。将按钮重命名为btnSubmit,您的呼叫将神奇地工作。

当您将按钮命名为Submit时,您将覆盖submit()表单上的功能。


55
这是一个方便的把戏。如果您对提交按钮感到困惑#submit,可以通过窃取另一个表单实例的submit()方法来解决它,例如:document.createElement('form').submit.call(document.frmProduct)
尼尔·皮尔森

35
似乎每个人都必须努力学习这一方法。会做好面试的问题
SeanDowney

9
我只是删除了name ='submit',而Bob是您的阿姨,它成功了!!
zzapper 2014年

2
太惊讶了,我从来没有遇到过这个问题,但是可惜,这就是问题所在!
natebeaty

3
我刚刚在这个问题上浪费了2-3个小时,非常感谢您的回答
Mehul Prajapati

12
<form action="product.php" method="post" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">

document.getElementById("submit_value").onclick = submitAction;

function submitAction()
{
    document.getElementById("frmProduct").submit();
    return false;
}
</script>

编辑:我不小心交换了ID的周围


document.getElementById(“ frmProduct”)。submit不是一个函数:(
金勇,

1
您是否具有ID为'frmProduct'的多个元素?
tvanfosson,2009年

添加submitAction作为onsubmit的处理程序,然后从中调用submit可能会造成无限循环。处理程序应与按钮的onclick相关联。
tvanfosson,2009年

1
否决准确答案吧?me脚的家伙,踩到我们得到您要卖掉灵魂的那些点
乍得·格兰特

@Chad Grant-无法同意。
Fenton'8

10

确保没有其他同名表单,并且表单中没有name =“ submit”或id =“ submit”。


9

如果您没有机会进行更改,name="submit"也可以通过以下方式提交表格:

function submitForm(form) {
    var submitFormFunction = Object.getPrototypeOf(form).submit;
    submitFormFunction.call(form);
}

5
HTMLFormElement.prototype.submit.call(form)也有效
musa

5

当我使用母版页创建MVC应用程序时遇到相同的问题。尝试如上所述查找带有“提交”作为名称的元素,但事实并非如此。

就我而言,它在我的页面上创建了多个标签,因此存在一些引用正确表单的问题。

要解决此问题,我将让按钮处理要使用的表单对象:

onclick="return SubmitForm(this.form)"

并与js:

function SubmitForm(frm) {
    frm.submit();
}

3

这个主题已经有很多答案,但是对我来说效果最好(最简单-一行!)的答案是对Neil E. Pearson从2013年4月21日发表的评论的修改:

如果您将提交按钮固定为#submit,则可以通过窃取另一个表单实例的commit()方法来解决此问题。

我对他的方法的修改以及对我有用的方法:

document.createElement('form').submit.call(document.getElementById(frmProduct));


2

给表单元素一个提交的名字将简单地遮盖提交属性。确保没有名称提交的表单元素,并且您应该可以很好地使用提交函数。


2

实际上,解决方案非常简单...

原版的:

    <form action="product.php" method="get" name="frmProduct" id="frmProduct"
enctype="multipart/form-data">
    <input onclick="submitAction()" id="submit_value" type="button" 
    name="submit_value" value="">
</form>
<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

解:

    <form action="product.php" method="get" name="frmProduct" id="frmProduct" 
enctype="multipart/form-data">
</form>

<!-- Place the button here -->
<input onclick="submitAction()" id="submit_value" type="button" 
    name="submit_value" value="">

<script type="text/javascript">
    function submitAction()
    {
        document.frmProduct.submit();
    }
</script>

您能解释一下如何解决OP的问题吗?
金斯利

可以肯定的是,在这种情况下(仅在这种情况下)问题出在范围之内。
Zurc Soirrab

1

您应该使用以下代码:

$(document).on("ready", function () {
       
        document.frmProduct.submit();
    });


尽管此代码段可以解决问题,但提供说明确实有助于提高您的帖子质量。请记住,您将来会为读者回答这个问题,而这些人可能不知道您提出代码建议的原因。也请尽量不要在代码中加入解释性注释,这会降低代码和解释的可读性!
Filnor

0

我用的是

var enviar = document.getElementById("enviar");
enviar.type = "submit"; 

仅仅因为其他一切都没有用。


0

我的解决方案是设置按钮的“表单”属性

<form id="form_id_name"><button name="btnSubmit" form="form_id_name" /></form>

还是js:

YOURFORMOBJ.getElementsByTagName("button")[0].setAttribute("form", "form_id_name");
YOURFORMOBJ.submit();

0

可能的解决方案-1.
确保您没有其他名称/ id为提交的元素。
2.尝试将函数调用为onClick = "return submitAction();"
3。document.getElementById("form-name").submit();


-1

你可以试试

<form action="product.php" method="get" name="frmProduct" id="frmProduct" enctype="multipart/form-data">

<input onclick="submitAction(this)" id="submit_value" type="button" name="submit_value" value="">

</form>

<script type="text/javascript">
function submitAction(element)
{
    element.form.submit();
}
</script>

您是否有多个同名表格?


By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.