完成时的 AJAX 递归回调答案

【问题标题】：AJAX recursive callback on completion完成时的 AJAX 递归回调
【发布时间】：2018-11-26 23:39:53
【问题描述】：

我有一个需要通过批处理删除的数据库。如下代码所示，根据数据库大小，可以有任意数量的step（当前批量迭代）。我想将函数redirect_to_homepage() 放在下面的代码中，以便在最后一个批处理之后，它重定向到一个新页面。目前，只要response.success 为真，它就会重定向，而不是我希望它等待delete_all_data() 的所有迭代完成然后重定向。我怎样才能做到这一点？

jQuery.ajax({
    url: ajaxurl,
    type: 'POST',
    data: {
        'action': 'deactivation_form_submit',
        'form-data': form_data,
    }
}).done( function( response ) {

    if ( response.success ) {
        if ( response.data.delete_data ) {
            delete_all_data( 1, form_data );
        }

        redirect_to_homepage();
    }
});

// This is a recursive AJAX function.
function delete_all_data( step, form_data ) {
    jQuery.ajax({
        url: ajaxurl,
        type: 'POST',
        data: {
            'form': form_data,
            'action': 'give_do_ajax_export',
            'step': step,
        },
        dataType: 'json',
    }).done( function( response ) {
        if ( true !== response.success && ! response.error ) {
            delete_all_data( parseInt( response.step ), form_data );
        }
    });
}

【问题讨论】：

确定all 的含义，使delete_all_data 返回true 或false，无论它是否还有要删除的内容，并且只有在没有其他内容要删除的情况下才重定向。类似的东西。

标签： javascript jquery ajax promise

【解决方案1】：

一种选择是为您的delete_all_data ajax 调用使用同步 ajax 调用，类似这样

function delete_all_data( step, form_data ) {
    jQuery.ajax({
        url: ajaxurl,
        async:false,
        type: 'POST',
        data: {
            'form': form_data,
            'action': 'give_do_ajax_export',
            'step': step,
        },
        dataType: 'json',
    }).done( function( response ) {
        if ( true !== response.success && ! response.error ) {
            delete_all_data( parseInt( response.step ), form_data );
        }
    });
}

这将停止执行重定向，直到最后一次调用 delete_all_data 已被执行。

如果你不想使用同步调用的其他选项，那么我们的函数如下所示

function delete_all_data( step, form_data ) {
    jQuery.ajax({
        url: ajaxurl,
        async:false,
        type: 'POST',
        data: {
            'form': form_data,
            'action': 'give_do_ajax_export',
            'step': step,
        },
        dataType: 'json',
    }).done( function( response ) {
        if ( true !== response.success && ! response.error ) {

            if(response.step != last) {/// check if this is not the last step
            delete_all_data( parseInt( response.step ), form_data );
           }
           else{
                ////// Your redirection code goes here (function call or direct window.location.href)
            }
        }
    });
}

如果有帮助，请告诉我们

【讨论】：

不要使用async:false。

【解决方案2】：

您可以将redirect_to_homepage() 方法作为回调传递，该回调将在达到所需条件时执行。

jQuery.ajax({
    .....
}).done( function( response ) {
    if ( response.success  response.data.delete_data ) {
         delete_all_data( 1, form_data, redirect_to_homepage ); //Pass function reference   
    }
});

// This is a recursive AJAX function.
function delete_all_data( step, form_data, cb ) {
    jQuery.ajax({
       .....
    }).done( function( response ) {
        if ( true !== response.success && ! response.error ) {
            delete_all_data( parseInt(response.step,10), form_data, cb);  //Pass function reference   
        }else{
            //At present assuming this 
            //Invoke the callback function 
            cb();  
        }
    });
}

【讨论】：