javascript 单击按钮时表单被提交两次
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16334265/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Form gets submitted twice on button click
提问by happy
I have called below javascript function on
我在下面调用了 javascript 函数
function formOnSubmit() {
if (document.forms[0].ref_no.value == "") {
if (document.forms[0].acc_code.value == "") {
if (document.forms[0].vendor_code.value == "") {
if (document.forms[0].acc_service_tax.value == "") {
if (document.forms[0].acc_doc_name.value == "") {
alert('Please enter atleast one attribute value');
return false;
}
}
}
}
} else {
return true;
document.forms[0].submit();
}
}
where, ref_no,acc_code,vendor_code,acc_service_tax,acc_doc_name are textboxes
其中，ref_no、acc_code、vendor_code、acc_service_tax、acc_doc_name 是文本框
The problem is form gets submitted twice when I enter something in ref_no texbox and form submitss once for the rest of textboxes.
问题是当我在 ref_no texbox 中输入内容时表单被提交两次，并且表单为其余的文本框提交一次。
I want to know why form gets submitted twice when I enter ref_no value.
我想知道为什么当我输入 ref_no 值时表单被提交两次。
回答by sql2k5dba
Finally got it straight for myself, and hopefully for others. If you are using a "button" and want to use document.forms[0],submit(), then specify the button type="button". Otherwise, the default button type will be used, which is submit, and in my case with IEyour form will be submitted twice.
终于为自己弄明白了，希望对其他人也是如此。如果您正在使用“按钮”并希望使用document.forms[0],submit()，则指定按钮type="button"。否则，将使用默认按钮类型，即submit，在我使用IE的情况下，您的表单将被提交两次。
回答by thedevd
Adding below given line solved my problem.
添加下面给定的行解决了我的问题。
e.stopImmediatePropagation();
回答by Simon Wang
If you call the function on a input which button type is submit, you need to remove the following line:
如果在提交按钮类型的输入上调用该函数，则需要删除以下行：
document.forms[0].submit();
Also this function generally should bind to the button as a onclick which actually just be:
此外，此功能通常应该作为 onclick 绑定到按钮，实际上只是：
onclick="return formOnSubmit()"
回答by mathew
change your input type "submit" to "button"
将您的输入类型“提交”更改为“按钮”
example
例子
<input type="button" value="submit" onClick=formOnSubmit(); />
回答by Kelvin Ferreira
I had the same problem but in my case was a little diferent: My code js:
我有同样的问题，但在我的情况下有点不同：我的代码 js：
$btnSave.on('click', function (e) {
e.preventDefault();
$formPreRequisites.trigger('submit');
});
And my form submit:
我的表格提交：
$myForm.on('submit', function (e) {
//mythings
});
Then I was having this problem with two calls of my button submit in 'on click' event. Then I put this in my method and it works. This prevents the event propagate in my html DOM elements.
然后我在“点击”事件中两次调用我的按钮提交时遇到了这个问题。然后我把它放在我的方法中并且它起作用了。这可以防止事件在我的 html DOM 元素中传播。
$btnSave.on('click', function (e) {
e.stopImmediatePropagation();
e.preventDefault();
$myForm.trigger('submit');
});
回答by Kelvin Ferreira
Use any one that is in else condition.
使用处于 else 状态的任何一种。
Use either:
使用：
document.forms[0].submit();
else
别的
return true;
And if you are using the return truein else condition then the function call in form tag on onSubmitevent.
如果您使用return truein else 条件，则在onSubmit事件的表单标记中调用函数。
<form action="//your action" method="//your method" onsubmit="return formOnSubmit()">
回答by Didier Kernwein
TL;DR
TL; 博士
Click handler function inside another click handler function attaches the same click handler multiple times based on the sum of clicks
另一个点击处理函数内的点击处理函数根据点击次数的总和多次附加同一个点击处理函数
This is not the solution for your example but a solution for the same problem. I added a click handler that prevents the form submit and opens a modal with a button. After you click the button in the modal the form should get submitted on the defined circumstances.
这不是您示例的解决方案，而是同一问题的解决方案。我添加了一个点击处理程序，可以防止表单提交并打开一个带有按钮的模式。单击模式中的按钮后，应在定义的情况下提交表单。
So far so good. But my code for the button click inside the modal was inside the scope of the outer click handler. So after you opened up the modal twice the form was submitted twice.
到现在为止还挺好。但是我在模态内单击按钮的代码在外部单击处理程序的范围内。因此，在您两次打开模态之后，表单被提交了两次。
