Question

我正在尝试使用Jquery表单插件验证和发布表单数据，以及验证（http://jquery.malsup.com/form/#ajaxForm）。

我尝试过发送数据而不进行验证，它运行正常。例如：

$('#encodeForm').ajaxForm(function(res) {
    $('#result').html(res.data);
    console.log(res);
    return false;
});

return false阻止页面导航到服务器响应。

但是，当我将选项对象替换为函数时，上述操作无效：

$('#encodeForm').ajaxForm({ ......, success : function() { return false; } });

关于传递选项对象，如何防止页面导航（而不是AJAX响应？）

尝试的方法：

在验证回调中嵌套表单（当前）
在表单回调中嵌套验证（失败）
在表单上使用form.submit闭包（失败）

Answer 1

$('#encodeForm').submit(function() {
    // submit the form
    $(this).ajaxSubmit();
    // return false to prevent normal browser submit and page navigation
    return false;
});

Answer 2

在充分利用代码和亚伯拉罕的笔记后，以下内容对我有用：

        $('#decodeForm').validate({
            // rules here ....


            }
        });


    $('#decodeForm').ajaxForm({

        beforeSubmit : function() {

            console.log('FORM: ' + $('#decodeForm').valid());

            //block if false
            return $('#decodeForm').valid();

        },

        success : function(res) {
            if (res.err) {
                console.log('ERROR: ' + res.err);

            }
            // do something with the data

        }

    });

注意：如果规则无效，AJAX查询似乎不起作用。如果您正在使用其中的函数，请确保包含additional-methods.min.js文件。

使用Jquery的AJAX请求，无需刷新页面，同时使用选项对象和回调

2 个答案: