Функции обратного вызова Javascript с помощью ajax

Question

Я пишу универсальную функцию, которая будет многократно использоваться в моем сценарии.

Функция использует ajax (используя библиотеку jQuery), поэтому я хочу каким-то образом передать функцию (или строки кода) в эту функцию для выполнения после завершения ajax. Я считаю, что это должна быть функция обратного вызова, но после прочтения нескольких ответов на обратный вызов я все еще немного озадачен тем, как бы я реализовал в моем случае.

Моя текущая функция:

function getNewENumber(parentENumber){

        $.ajax({
               type: "POST",
               url: "get_new_e_number.php",
               data: {project_number: projectNumber, parent_number: parentENumber},
               success: function(returnValue){
                    console.log(returnValue);
                    return returnValue; //with return value excecute code

                },
                error: function(request,error) {
                    alert('An error occurred attempting to get new e-number');
                    // console.log(request, error);
                }
        });
    }

С помощью этой функции я хочу иметь возможность делать то же самое, что и другие функции jQuery, т. Е.

var parentENumber = E1-3;

getNewENumber(parentENumber, function(){
    alert(//the number that is returned by getNewENumber);
});

Answer 1

Просто дайте getNewENumber другой параметр для функции, затем используйте его в качестве обратного вызова.

   // receive a function -----------------v
function getNewENumber( parentENumber, cb_func ){

    $.ajax({
           type: "POST",
           url: "get_new_e_number.php",
           data: {project_number: projectNumber, parent_number: parentENumber},

             // ------v-------use it as the callback function
           success: cb_func,
            error: function(request,error) {
                alert('An error occurred attempting to get new e-number');
                // console.log(request, error);
            }
    });
}

var parentENumber = E1-3;

getNewENumber(parentENumber, function( returnValue ){
    alert( returnValue );
});

Answer 2

@ patrick dw's anwser правильно.Но если вы хотите продолжать вызывать console.log (или любые другие действия) всегда, независимо от того, что делает функция кода вызывающего абонента, тогда вы можете добавить обратный вызов (ваш новый параметр) внутри уже имеющейся у вас функции успеха:

function getNewENumber(parentENumber, cb_func /* <--new param is here*/){ 

    $.ajax({
           type: "POST",
           url: "get_new_e_number.php",
           data: {project_number: projectNumber, parent_number: parentENumber},
           success: function(returnValue){
                console.log(returnValue);
                cb_func(returnValue); // cb_func is called when returnValue is ready.
            },
            error: function(request,error) {
                alert('An error occurred attempting to get new e-number');
                // console.log(request, error);
            }
    });
}

И код вызова остается таким же, как ваш, за исключением того, что функция получит returnValue по параметру:

var parentENumber = E1-3;

getNewENumber(parentENumber, function(val /* <--new param is here*/){
    alert(val);
});

Answer 3

Это было бы лучше сделать с отложенными объектами в jQuery. Пусть ваш AJAX вызов возвратит объект jqXHR.

function getNewENumber(parentENumber) {
    return $.ajax( { ... } );
}

getNewENumber(E1 - 3).then(success_callback, error_callback);

Если вы хотите сохранить функцию обратного вызова с ошибкой в пределах , эту функцию можно зарегистрировать вместо нее:

function getNewENumber(parentENumber) {
    var jqXHR = $.ajax( { ... } );
    jqXHR.fail( ... );
    return jqXHR;
}

getNewENumber(E1 - 3).done(success_callback);