jQuery 使用 preventDefault() 时，如何在单击按钮时提交表单？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11581462/
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
How can I submit form on button click when using preventDefault()?
提问by Steven
I'm using jQuery's .preventDefault()to prevent form submit when users clicks the [ENTER] key. The problem is that it also stops the form submitting when I click the submit button.
.preventDefault()当用户单击 [ENTER] 键时，我使用 jQuery来防止表单提交。问题是当我单击提交按钮时，它也会停止提交表单。
I see there are many threads on Stackoverflow in regards of .preventDefault(), but none of them addresses my problem.
我看到 Stackoverflow 上有很多关于 的线程.preventDefault()，但没有一个能解决我的问题。
Here's the code I'm currently working on.
这是我目前正在处理的代码。
// Part of my form
<form id="subscription_order_form" class="" method="post" action="some_url">
<button id="btn_order" type="submit">Order</button>
</form>
// Prevent the form to be submitted on ENTER
$('#subscription_order_form').submit(function(e){
e.preventDefault();
});
// Controll data
$('#btn_order').click(function(){
checkMandatoryFields();
});
// Check mandatory fields before subitting:
function checkMandatoryFields(e){
// Code for testing here
// Set "error" message and abort submission
if(msg.length > 0) {
// Do something
} else {
//submit or trigger is not recognized as functions
$('#subscription_order_form').submit(); //.trigger('submit');
}
}
Can anyone please tell my what he code for submitting the form on button click is?
谁能告诉我他提交按钮单击表单的代码是什么？
回答by Kevin B
Trigger the submit event on the DOM Node, not a jQuery Object.
在 DOM 节点上触发提交事件，而不是 jQuery 对象。
$('#subscription_order_form')[0].submit();
or
或者
$('#subscription_order_form').get(0).submit();
or
或者
document.getElementById("subscription_order_form").submit();
This bypasses the jQuery bound event allowing the form to submit normally.
这绕过了 jQuery 绑定事件，允许表单正常提交。
回答by Hans Hohenfeld
Change the submit button to a normal button and handle submitting in its onClick event.
将提交按钮更改为普通按钮并在其 onClick 事件中处理提交。
As far as I know, there is no way to tell if the form was submitted by Enter Key or the submit button.
据我所知，没有办法判断表单是通过 Enter Key 提交的还是通过提交按钮提交的。
回答by Romain
You need to use
你需要使用
$(this).parents('form').submit()
回答by adeneo
Replace this :
替换这个：
$('#subscription_order_form').submit(function(e){
e.preventDefault();
});
with this:
有了这个：
$('#subscription_order_form').on('keydown', function(e){
if (e.which===13) e.preventDefault();
});
That will prevent the form from submitting when Enter key is pressed as it prevents the default action of the key, but the form will submit normally on click.
这将阻止表单在按下 Enter 键时提交，因为它阻止了该键的默认操作，但表单将在单击时正常提交。
回答by Jorge
Ok, first e.preventDefault();it's not a Jquery element, it's a method of javascript, now what it's true it's if you add this method you avoid the submit the event, now what you could do it's send the form by ajax something like this
好的，首先e.preventDefault();它不是一个 Jquery 元素，它是一个 javascript 的方法，现在它是真的，如果你添加这个方法，你就可以避免提交事件，现在你可以做的是通过 ajax 发送表单，就像这样
$('#subscription_order_form').submit(function(e){
$.ajax({
url: $(this).attr('action'),
data : $(this).serialize(),
success : function (data){
}
});
e.preventDefault();
});
