从jQuery Ajax函数检索数组数据到javascript

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

你有麻烦与你的范围。

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"]); 

} 

当您收到数据形成阿贾克斯成功，他们现在可以在ajaxResult变种。在这个例子中，我说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 2

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

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

Answer 3

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

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

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

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