初始化后如何覆盖jQuery.ajax成功函数？

Question

单击按钮会触发ajax请求。 当用户在第一个请求仍在加载时再次单击按钮时，我想用另一个请求覆盖第一个请求的成功功能。

基本上我想这样做：

var ajaxRequest = null;

jQuery('#mybutton').click(function () {
    if (ajaxRequest) {
        ajaxRequest.success = function () {
        };
    }

    ajaxRequest = jQuery.ajax({
        url: '...',
        success: function () {
            console.debug('do something');
        }
    });
});

但是最初的成功处理程序被调用了。 如何实现覆盖？

Answer 1

您可以尝试以下hack，我已经使用asynch setTimeout（而不是asynch jQuery.ajax）对其进行了测试，并且可以正常工作-

var mySuccessHander = function() {
    console.debug('Initial function');
}

var test = jQuery.ajax({
    url: '...',
    success: function() {
        mySuccessHander();
    }
});

当第二次单击该按钮时，请执行以下操作-

mySuccessHander = function() {
    console.debug('Overridden function');
}

Answer 2

您可以先将ajax参数设置为变量，以便稍后进行修改。

var clicks = 0,
    ajaxArgs = {
        url: '...',
        success: function () {
            console.debug('do something');
        }
    };


$('#myButton').click(function() {
    ++clicks; 
    if (clicks > 1) {
        // set the success function if clicked more than once
        ajaxArgs.success = function () {
            console.debug('Success function ' + clicks);
        }
    }

    $.ajax(ajaxArgs);
});

如果您只想在仍加载ajax时修改成功函数，则可以执行以下操作：

var loading = false,
    ajaxArgs = {
        url: '...',
        success: function () {
            console.debug('do something');
        }, complete: function () {
            loading = false;
        }
    };

$('#myButton').click(function() {
    if (loading) {
        // set the success function if ajax is still loading
        ajaxArgs.success = function () {
            console.debug('Another Success function ');
        }
    } else {
        loading = true;
        $.ajax(ajaxArgs);
    }
});

Answer 3

好问题，这将工作..

var isRequestDone = true;

jQuery('#mybutton').click(function () {
    var requestParams = {
        url: '....',
        beforeSend: function () {
            isRequestDone = false;
        },
        success: function () {
            isRequestDone = true;
            console.debug('do something');
        },
        error: function () {
            isRequestDone = true;
        }
    }
    if (!isRequestDone) {
        requestParams.success = function () {
            console.log('please wait for a while!'); 
        };
    }

    jQuery.ajax(requestParams);
});

beforeSend将在请求到达服务器之前触发，因此当服务器上的请求isRequestDone为false时，将更改成功处理程序。 从第一个请求成功回调后，它将再次恢复为原始。