Объявление переменной в функции AJAX и вызов ее позже (jQuery)

Question

У меня есть функция AJAX, которая работает правильно, но я не могу получить доступ к переменным, которые я объявляю в функции позже на странице. Если вы посмотрите на приведенный ниже код, вы увидите, что я предупреждаю переменную number_rows в пределах функции, которая работает, но когда я пытаюсь выполнить вход в нее вне функции, она возвращается как «неопределенная».

var newData = "user_id=" + id; 

    $.ajax({ 
     type: 'POST', // HTTP method POST or GET 
     url: 'ajax.php', //Where to make Ajax calls 
     dataType:'text', // Data type, HTML, json etc. 
     data:newData, //post variables 
     success:function(response){ 

      var number_rows = response; 
      alert(number_rows); 

     }, 
     error:function (xhr, ajaxOptions, thrownError){ 
      alert(xhr + " " + ajaxOptions + " " + thrownError); //throw any errors 
     } 
    }); 

console.log(number_rows); 

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

success:function(response){ 

     $('body').append('<span class="ajax_response" id="' + response + '"></span>'); 

    } 

var number_rows = $('.ajax_response').attr('id'); 
console.log(number_rows); 

Но по какой-то причине не в состоянии сразу же подобрать значение идентификатора таким образом. Я могу подтвердить, что диапазон выполняется с правильным значением ID, но по какой-то причине он не обрабатывает его правильно. Любая помощь с этим была бы весьма признательна.

Спасибо!

Answer 1

Изменен объем вашей переменной.
Изменить async: false или подождать, пока вы не получите ответ от сервера, а затем используйте значение.

var newData = "user_id=" + id; 
var number_rows = ""; //Declare Here 

    $.ajax({ 
     type: 'POST', // HTTP method POST or GET 
     url: 'ajax.php', //Where to make Ajax calls 
     dataType:'text', // Data type, HTML, json etc. 
     data:newData, //post variables 
     async: false, 
     success:function(response){ 

      number_rows = response; //assign here 
      alert(number_rows); 

     }, 
     error:function (xhr, ajaxOptions, thrownError){ 
      alert(xhr + " " + ajaxOptions + " " + thrownError); //throw any errors 
     } 
    }); 

console.log(number_rows); //Use here 

Answer 2

Да, ваш прицел выключен. Если вы определяете переменную внутри функции, как и вы, вы не можете получить доступ к ней за ее пределами. Также ваш ajax-вызов - асинхронный и любой код.

Включите консоль.log внутри функции успеха, иначе она, вероятно, будет регистрироваться не определена, даже если вы объявите переменную глобально вне функции.

var newData = "user_id=" + id; 
var number_rows; 
$.ajax({ 
    type: 'POST', // HTTP method POST or GET 
    url: 'ajax.php', //Where to make Ajax calls 
    dataType:'text', // Data type, HTML, json etc. 
    data:newData, //post variables 
    success:function(response){ 
     number_rows = response; 
     alert(number_rows); 
     console.log(number_rows); // here, so we are sure it's set. 
     }, 
     error:function (xhr, ajaxOptions, thrownError){ 
      alert(xhr + " " + ajaxOptions + " " + thrownError); //throw any errors 
     } 
    }); 

Answer 3

Просто добавьте в конфигурации:

async:false 

Ваш код может быть выглядеть следующим образом:

var newData = "user_id=" + id; 
var number_rows = ""; //This is a global variable 

    $.ajax({ 
     type: 'POST', 
     url: 'ajax.php', 
     dataType:'text', 
     data:newData, 
     async:false, //<------This is the option you must add 
     success:function(response){ 

      number_rows = response; //<----- receive data from the server 
      alert(number_rows); 

     }, 
     error:function (/*stuff here*/){ 
      //stuff here 
     } 
    }); 

    //Check data 
    console.log(number_rows); 

удачи ^^!