我有这个基本形式:
<form id="myForm" name="myForm" action="index.php" method="post">
<input type="submit" value="Submit" />
</form>
然后我的jQuery附加提交事件:
$( document ).ready(function() {
var frm = $('#myForm');
frm.submit(function (ev) {
ev.preventDefault();
$.ajax({
type: frm.attr('method'),
url: frm.attr('action'),
data: frm.serialize(),
success: function (data) {
alert('ok');
}
});
});
});
当我按下“提交”按钮时,它工作正常,我收到“确定”的警报。
但是,如果我将Submit按钮更改为实际按钮,然后通过javascript添加onclick函数,如下所示:
<input type="button" value="Submit" onclick="submitF(this.form);" />
JS:
function submitF(form) {
form.submit();
}
我的jQuery事件不会触发,该表单通常会提交。
如果我将jQuery函数附加到表单提交事件,为什么当JavaScript提交表单时它不会触发?
最佳答案
这样做是因为jQuery不会阻止javascript中的本机提交触发器。
这样做是为了防止表单提交,然后例如可以稍后以编程方式提交表单
$('form').on('submit', function(e) {
e.preventDefault():
// do stuff
// then submit form
this.submit(); // does not trigger this event handler but submits the form instead
});
如果要触发jQuery事件处理程序并阻止表单提交,请执行
function submitF(form) {
$(form).submit();
}