Блог

Главная - Вопросы по программированию - Присвоение возвращаемого значения ajax-вызова переменной с помощью jquery

Присвоение возвращаемого значения ajax-вызова переменной с помощью jquery

#javascript #ajax #jquery #global-variables

#javascript #ajax #jquery #глобальные переменные

Вопрос:

Как я могу присвоить переменную (var) объекту json, который возвращается из ajax-вызова на сервер? Мне нужно получить доступ к этому объекту в остальной части тела.

Например, я пробовал это, я не уверен, что это правильно.

 var selectValues=$(document).ready(function() {
    $.ajax({
                  type: "POST",
                  url: "http://10.0.2.2/mobileajax/callajax.php",
                  data: ({name: theName}),
                  cache: false,
                  dataType: "text",
                  success: onSuccess
                });
})


var $vendor = $('select.mobile-vendor');
var $model = $('select.model');
$vendor.change(
              function() {
                  $model.empty().append(function() {
                      var output = '';
                      $.each(selectValues[$vendor.val()], function(key, value) {
                          output  = '<option>'   key   '</option>';
                      });
                      return output;
                  });
              }).change();

// bonus: how to access the download link
$model.change(function() {
    $('a#download-link').attr('href', selectValues[$vendor.val()][$model.val()]).show();
});

Обратите внимание, что переменная selectValues используется в остальной части текста.

Ответ №1:

Я думаю, вам следует выполнить весь код внутри $(document).ready(function() функции, а затем сделать вызов ajax синхронным. Потому что теперь вызов ajax будет выполнен, когда документ будет готов, но другой код будет выполняться напрямую, не дожидаясь, пока документ будет готов. Также вызов ajax по умолчанию асинхронный, поэтому вы должны сделать его синхронным и назначить selectValues переменную внутри функции успеха ajax-вызова. Это станет чем-то вроде этого:

 $(document).ready(function() {
        var selectValues;
        $.ajax({
              type: "POST",
              url: "http://10.0.2.2/mobileajax/callajax.php",
              data: ({name: theName}),
              cache: false,
              dataType: "text",
              async: false,
              success: function(data) {
                selectValues = data
              }
            });

            var $vendor = $('select.mobile-vendor');
            var $model = $('select.model');
            $vendor.change(
                          function() {
                              $model.empty().append(function() {
                                  var output = '';
                                  $.each(selectValues[$vendor.val()], function(key, value) {
                                      output  = '<option>'   key   '</option>';
                                  });
                                  return output;
                              });
                          }).change();

            // bonus: how to access the download link
            $model.change(function() {
                $('a#download-link').attr('href', selectValues[$vendor.val()][$model.val()]).show();
            });
})

Ответ №2:

вы должны определить переменную вне document ready области следующим образом:

 var selectValues;
$(document).ready(function() {
    // ajax
});

в функции onSuccess вы можете определить selectValues = data или что-то в этом роде

Комментарии:

1. присвоение данных selectValues ? Мне нужно присвоить возвращаемое значение, а не отправляющее значение.

2. извините, я имел в виду response , поэтому что-то вроде success: function(response) { selectValues = response; }

3. Большое спасибо за быстрый ответ!

4. пока остальной ваш код не находится в готовом документе, это не может работать.. потому что остальная часть кода будет выполнена до присвоения выбранных значений.

5. верно, но это срабатывает только по change событиям 🙂

Ответ №3:

 $.ajax({
              type: "POST",
              url: "http://10.0.2.2/mobileajax/callajax.php",
              data: ({name: theName}),
              cache: false,
              dataType: "text",
              success: function (result){
                  var selectValues=resu<
              }
            });

попробуйте это.

Комментарии:

1. var selectValues будет доступно только в success функции, а не за пределами этой области

2. Затем определите «значения выбора переменной» как глобальные

3. действительно, это должен быть ваш ответ Кугатасану Абимарану

4. Даже если selectValues значение является глобальным, обратите внимание, что остальная часть страницы фактически не сможет получить доступ к значениям до тех пор, пока не будет выполнен успешный обратный вызов.

Ответ №4:

Вот как мы извлекаем возвращаемую информацию из наших (xml) ajax-вызовов:

 $.ajax ({
    type: "POST",
    url: "something.cgi?someparam=whatever",
    data: "key=valamp;key2=val2",
    dataType: "xml", // you use json, but I don't think it matters
    success: function (data) {
    if ($("error", data).text() === "") {
        // I could assign $("error", data).text() to a var just here
        // This gets the "error" parameter out of the returned xml or
        // json, here contained in "data"
    }
    [snip the rest]

Ответ №5:

Другой способ сделать это — добавить остальную часть вашего кода в успешный обратный вызов, подобный этому:

 $(document).ready(function() {
        $.ajax({
              type: "POST",
              url: "http://10.0.2.2/mobileajax/callajax.php",
              data: ({name: theName}),
              cache: false,
              dataType: "text",
              async: false,
              success: function(selectValues) {
                var $vendor = $('select.mobile-vendor');
                var $model = $('select.model');
                $vendor.change(
                              function() {
                                  $model.empty().append(function() {
                                      var output = '';
                                      $.each(selectValues[$vendor.val()], function(key, value) {
                                          output  = '<option>'   key   '</option>';
                                      });
                                      return output;
                                  });
                              }).change();

                // bonus: how to access the download link
                $model.change(function() {
                    $('a#download-link').attr('href', selectValues[$vendor.val()][$model.val()]).show();
                });
              }
            });

})