Question

我试图存储我从JSON Ajax函数中检索的数据。当我从ajax函数内部控制输出数据时，它工作正常，但是当我尝试对数据变量执行相同操作时，它会失败。

我没有正确存储结果数据吗？

function f_find() {

   // create my data object from the results

   var result = $.ajax({
      url      : '../scripts/php/users/f_users.php',
      type     : 'GET',
      dataType : "json",
      data     : {'action':'find'},
      success  : function(data) {

                    // this bit works

                    console.log(data[0]["field01"]);
                    console.log(data[1]["field01"]);

                 },
      error    : function(log) {
                    console.log(log.message);
                 }
   });

   // this shows me that my result is an object

   console.log(result);

   // this bit fails

   console.log(result[0]["field01"]);
   console.log(result[1]["field01"]);

}

php如下

<?php

if(isset($_GET['action'])) {

   switch($_GET['action']) {

      case 'find':
         f_find();
         break;

      default:
         echo json_encode();
         return;
         break;

   }

}

function f_find() {

   $la_info = array();

   $la_info[0]["field01"] = "index 0 field 1";
   $la_info[0]["field02"] = "index 0 field 2";

   $la_info[1]["field01"] = "index 1 field 1";
   $la_info[1]["field02"] = "index 1 field 1";

   echo json_encode($la_info);

}

?>

Answer 1

ajax调用是异步发生的。 “失败”实际上只是在ajax响应之前运行。查看控制台，注意两个失败的console.logs在两个“工作”的console.log语句之前写入控制台。

此外......“data”变量只能在“success”回调的范围内访问，除非您将其值存储在全局范围内。 window.data = data;

Answer 2

您的示波器有问题。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions

试试这个：

function f_find() {
   var ajaxResult = null;
   // create my data object from the results

   $.ajax({
      url      : '../scripts/php/users/f_users.php',
      type     : 'GET',
      async: false, 
      dataType : "json",
      data     : {'action':'find'},
      success  : function(data) {

                    // this bit works
                    ajaxResult = data;
                    console.log(data[0]["field01"]);
                    console.log(data[1]["field01"]);
                 },
      error    : function(log) {
                    console.log(log.message);
                 }
   });

   console.log(ajaxResult[0]["field01"]);
   console.log(ajaxResult[1]["field01"]);

}

当你从ajax成功收到数据时，它们现在可以在ajaxResult var中找到。在这个例子中，我说ajax是同步的，以防止在收到你的ajax回调之前调用console.log。

您也可以使用此表示法执行此操作：

function f_find() {
   // create my data object from the results

   $.ajax({
      url      : '../scripts/php/users/f_users.php',
      type     : 'GET', 
      dataType : "json",
      data     : {'action':'find'},
      error    : function(log) {
                    console.log(log.message);
                 }
   }).done(function(data){
       console.log(data[0]["field01"]);
       console.log(data[1]["field01"]);
   });

}

但您仍然无法访问完成范围之外的数据。

Answer 3

正如@Dekel所说，这是一个时间问题（除了两个数据变量的奇怪之处）。 Kevin Grosgojat的回答仍然会有时间问题。

$ .ajax函数是异步的。这意味着ajax函数触发了对服务器的数据请求，当服务器正在处理时，处理继续按下你的两个外部控制台输出但是此时服务器没有响应，所以那里没有要显示的数据。一段时间后服务器响应ajax调用，你的内部控制台日志会吐出你预期的答案。

'如果'你的原始代码现在适合你，那将是因为你有一个非常快的服务器或非常小的服务器进程来获取数据，但它肯定会受到影响并且是生产中的间歇性错误。

您可以'将参数添加到ajax函数以使其同步运行（意味着等待服务器响应），但这很少是您真正想要的最终解决方案。

将JQuery Ajax函数中的数组数据检索到javascript中

3 个答案: