Jquery可选择添加回调

时间:2016-01-25 15:35:15

标签: javascript jquery

我正在尝试编写一个可重用的Jquery表单函数。我需要它来选择性地分配回调函数,具体取决于函数是否在页面上定义。

这个例子我使用的是Success,但是会为所有人完成。

在主JS文件上:

function gJs_AjaxCustomSubmit(ObjectContext) {

    var AS='';
    if (typeof AjaxSuccess == 'function') { AS = 'AjaxSuccess' }

    $('#frm').ajaxSubmit({

        success: AS, //callback functions

    });
}

在页面上,如果存在AjaxSuccess函数,那么它将在成功回调上执行。如果它不存在,则不会有错误。

在普通网页上:

function AjaxSuccess(response) {
    alert(response);
}

我希望能够像这样在我的全局JS上定义所有函数,然后如果需要,我可以将实际函数添加到我的页面中,然后它们就会运行。

function gJs_AjaxCustomSubmit(ObjectContext) {
    var AStart='';
    if (typeof AjaxStart == 'function') { AS = 'AjaxStart' }
    var ASuccess='';
    if (typeof AjaxSuccess == 'function') { AS = 'AjaxSuccess' }
    var ABSend='';
    if (typeof AjaxBeforeSend== 'function') { AS = 'AjaxBeforeSend' }
    var AComplete='';
    if (typeof AjaxComplete== 'function') { AS = 'AjaxSuccess' }
    var ASt='';
    if (typeof AjaxStop== 'function') { AS = 'AjaxStop' }
    var AError='';
    if (typeof AjaxError== 'function') { AS = 'AjaxError' }

    $('#frm').attr("action", $(ObjectContext).data('path'));
    $('#frm').ajaxSubmit({
        dataType: 'html',

        start: AStart, //callback functions
        send: ABSend, //callback functions
        complete: AComplete, //callback functions
        stop: AjaxStop,
        success: ASuccess, //callback functions
        error: AError, //callback functions
    });
}

2 个答案:

答案 0 :(得分:0)

这是一个干净的可重用函数,它返回所需的函数(如果存在)或空函数(如果它不存在)。

$('#frm').ajaxSubmit({
    start: getFunction('AStart'), 
    send: getFunction('ABSend'),
    complete: getFunction('AComplete'),
    //... //callback functions
});

function getFunction(name){
    if (typeof window[name] == 'function'){
           return window[name];
    }
    return function(){};  // or null/false
} 

如果按名称作为参数传递的函数不存在,将返回一个空回调,它将不执行任何操作,并且不会抛出任何错误。

答案 1 :(得分:-2)

我最终使用了这个。

    function gJs_AjaxCustomSubmit(ObjectContext) {
        //Add function to your page if needed
        //AjaxStart
        //AjaxBeforeSend
        //AjaxComplete
        //AjaxSuccess
        //AjaxStop
        //AjaxError

    var DataType = 'html', AStart = '', ASuccess = '', ABSend = '', AComplete = '', AStop = '', AError = '';
    if ($(ObjectContext).data('type')) {
        DataType = $(ObjectContext).data('type');
    }
    if (typeof AjaxStart == 'function') { AStart = AjaxStart }
    if (typeof AjaxBeforeSend == 'function') { ABSend = AjaxBeforeSend }
    if (typeof AjaxComplete == 'function') { AComplete = AjaxComplete }
    if (typeof AjaxSuccess == 'function') { ASuccess = AjaxSuccess }
    if (typeof AjaxStop == 'function') { AStop = AjaxStop }
    if (typeof AjaxError == 'function') { AError = AjaxError }

    $('#frm').attr("action", $(ObjectContext).data('path'));
    $('#frm').ajaxSubmit({
        dataType: 'html',
        start: AStart, //callback functions
        send: ABSend, //callback functions
        complete: AComplete, //callback functions
        stop: AStop,
        success: ASuccess, //callback functions
        error: AError, //callback functions
    });
}