如何使用jQuery ajax作为数据的函数

Question

为了减少重复的脚本,我创建了以下插件,只要data保持不变就可以工作.

$.fn.myValid = function(rules, options) {
    this.validate({
        rules: rules.rules,
        messages: rules.messages,
        submitHandler: function(form) {
            var o = Object.assign({},{
                type:'POST',
                url:null,
                data: $(form).serializeArray(),
                dataType: 'json',
                success: function (rsp){
                    //Instead of reloading page, do dynamicly
                    $.unblockUI();
                    alert('record submitted')
                    location.reload();
                },
                error: function (xhr) {
                    $.unblockUI();
                    alert(xhr.responseJSON.message);
                }
                }, options);
            //if (typeof o.data === "function") o.data=o.data(form);
            $.blockUI();
            $.ajax(o);
        }
    });
};

如果data需要改变,我不能简单地返回类似$(form).serializeArray().concat($('#common-inputs').serializeArray(form))因为form尚未定义的东西,所以相反我认为返回一个函数会起作用.但是,当触发ajax时,它data是一个函数,而不是字符串,数组或普通对象,因此数据不会发送到服务器.

$('#help-form').myValid(validObj.common, {url:'ajax.php','data': function(form){
    console.log('this is never executed);
    return $(form).serializeArray().concat($('#common-inputs').serializeArray(form))
}});

作为一种解决方法,我包括o.data=o.data(form);(在上面的脚本中注释掉)来执行函数以返回结果,并且它可以根据需要工作.但是,我认为它更像是一种黑客攻击,并且有一种正确的方法可以做到这一点.

使用jQuery ajax将函数用作数据的正确方法是什么？

对于其他属性,例如,等等url,解决方案是否会有所不同success？

Answer 1

您可以使用beforeSend回调来设置数据值:

beforeSend: function( xhr, settings ) {
    this.data = $(form).serialize(); // or settings.data = $(form).serialize();
}, 

您可以修改网址和成功回调的方式相同:

this.url = 'new-url';
this.success = newSuccessCallback;

类似的问题

请注意,这不适用于GET请求,但POST应该可以正常工作.

Answer 2

您的第一个问题：通过 jQuery ajax 使用函数作为数据的正确方法是什么？

函数可用于创建任何类型的数据，只要您要在函数调用中返回数据即可。与 jquery ajax 一样，这将是一个回调函数，您可以在需要时调用它。

# Example

function formData( form ) {
    // do anything
    return form.serialize();
}

var request = $.ajax({
    // set properties
    data: formData.call( context, form );
});

对于其他属性（例如 url、success 等），解决方案是否会有所不同？

对于成功回调，使用 .done() 方法或 .fail() 方法来处理错误

和网址：

function getFormURL( form ) {
    return form.attr('action');
}

url: getFormURL.call( context, .form );