Question

我有这个基本形式：

<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');
            }
        });
    });
});

当我按下提交按钮时，它工作正常，我收到提示＆＃39;确定＆＃39;。

但如果我将提交按钮更改为实际按钮，则通过javascript添加onclick功能，如下所示：

<input type="button" value="Submit" onclick="submitF(this.form);" />

JS：

function submitF(form) {
    form.submit();
}

我的jQuery事件没有触发，表单就像通常那样提交。

如果我将jQuery函数附加到表单提交事件，为什么在javascript提交表单时它不会触发？

Answer 1

这样做是因为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();
}

通过js函数提交表单时，jQuery preventdefault提交表单不起作用？

1 个答案: