我在每个页面上都注入了这个jQuery函数,以便在单击后禁用提交按钮。
$('form').submit(function () {
var btn = $('input[type=submit]', this);
disableButtonOrLink.disableSubmit(btn);
btn = $('button[type=submit]', this);
disableButtonOrLink.disableSubmit(btn);
});
问题是我也有一些后端验证,有时以这样的形状附加到表单上
<form action="someAction" method="post" name="someForm" class="form"
onsubmit="var invalid=false;
invalid=someAction();
if(invalid){return false;}"
id="someForm">
我遇到的问题是('form').submit 操作总是在返回 false 后被调用。由于返回错误,表单实际上并未提交;但是这个jQuery函数仍然被调用。有没有办法防止这个.submit被调用?
只是为了澄清正在发生的事情:正在调用表单上的 onSubmit;
返回错误部分被击中并正确取消提交;
onSubmit 完成后,仍会调用 ('form').submit,就好像表单的提交未被取消并且正在禁用按钮一样。
我想防止最后一步发生。
JQuery 在form
中找到这些按钮,并使用一种方法来阻止它们通常执行的操作。
例:
$("form button").on('click', function(e){
e.preventDefault();
});
我可能会尝试这样的事情
$('#someForm').on('submit', function(e) {
if ($(this).data('some-action')) {
e.preventDefault();
return false;
}
//... then disable buttons, etc
});
在这种情况下,您需要将属性data-some-action
添加到表单中,并使用您正在执行的任何后端验证进行评估。
更新
$('#someForm').on('submit', function(e) {
if ($(this).data('some-action') == 'error-message') {
e.preventDefault();
alert('error!');
return false;
}
if ($(this).data('some-action') == 'reload') {
e.preventDefault();
document.location.reload(true);
}
//... then disable buttons, etc
});