How to override the jQuery.ajax success function after it has been initialized?

前端 未结 3 1237
不知归路
不知归路 2021-01-21 22:55

A button click triggers an ajax request. When the user clicks the button a second time while the first request is still loading, i want to override the first request\'s success

相关标签:
3条回答
  • 2021-01-21 22:59

    You can try the following hack, I have tested it with asynch setTimeout (instead of asynch jQuery.ajax) and it works -

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

    And when the button is clicked for the second time, execute following -

    mySuccessHander = function() {
        console.debug('Overridden function');
    }
    
    0 讨论(0)
  • 2021-01-21 23:05

    You can set the ajax arguments to a variable first so you can modify it later on.

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

    If you want to modify the success function only when ajax is still loading you can do this:

    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);
        }
    });
    
    0 讨论(0)
  • 2021-01-21 23:07

    Nice question , this will work..

    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 will fire just before the request will go to server , so when request in on the server isRequestDone will be false and hence will change success handler . on success callback from the first request it will again back to original.

    0 讨论(0)
提交回复
热议问题