從 Jquery JSON 獲得響應

Question

我無法從我的 php jquery / json / ajax 獲得回復。我一直將所有這些不同的教程組合在一起，但我似乎仍然無法將它們全部組合在一起，因為沒有一個教程遵循我正在嘗試做的事情。

現在我正在嘗試將兩個 arrays（因為沒有簡單的方法來傳遞關聯數組）傳遞給我的 jquery ajax function 並提醒它。 這是我的代碼：

PHP

$names = array('john doe', 'jane doe');
$ids = array('123', '223');

$data['names'] = $names;
$data['ids'] = $ids;

echo json_encode($data);

Jquery

function getList(){
    $.ajax({  
        type: "GET", 
        url: 'test.php', 
        data: "",  
        complete: function(data){ 
            var test = jQuery.parseJSON(data);
            alert(test.names[0]);
            alert("here");
        }
    },
        "json");
}
getList();

在我的 html 文件中，我真正調用的是用於調試目的的 javascript 文件。 我知道我返回的是 object，但我的名稱部分出現 null 值錯誤，我不確定原因。 我錯過了什么？

我的 PHP 文件返回

{"names":["john doe","jane doe"],"ids":["123","223"]}

它似乎只是在這里結束Uncaught TypeError: Cannot read property '0' of undefined所以我的 sub0 正在殺了我。

Answer 1

您可以使用 jQuery 提供的$.getJSON facade，這將為標准 JSON 請求設置所有必需的 ajax 參數：

$.getJSON('test.php', function(response) {
    alert(response.names[0]);   // john doe
}); 

但是我認為問題的根源是 1) 您的服務器可能沒有返回正確的響應代碼和/或正確的標頭（即：JSON 數據） - 但是至少對於后者的上述方法應該強制得出這個結論。

參見： http://api.jquery.com/jQuery.getJSON

Answer 2

看起來問題是您使用的是完整回調而不是成功回調：

function getList(){
    $.ajax({  
        type: "GET", 
        url: 'test.php', 
        data: "",  
        success: function(data) { /* success callback */
            var test = jQuery.parseJSON(data);
            alert(test.names[0]);
            alert("here");
        }
    },
    "json");
}
getList();

來自jQuery AJAX文檔：

成功（數據，文本狀態，jqXHR）

如果請求成功，將調用 function。 function 得到傳三 arguments：從服務器返回的數據，根據dataType參數格式化； 描述狀態的字符串； 和jqXHR（在jQuery 1.4.x，XMLHttpRequest）object。從jQuery 1.5開始，成功設置可以接受函數數組。 每個function都會依次調用。 這是一個 Ajax 事件。

完成（jqXHR，文本狀態）

請求完成時調用 function（執行成功和錯誤回調后）。 function 通過了兩個 arguments：jqXHR（在 jQuery 1.4.x，XMLHTTPRequest 中）object 和一個對請求狀態進行分類的字符串（“成功”、“未修改”、“錯誤”、“超時”、“中止”或“解析器錯誤”）。 截至jQuery 1.5，完整設置可以接受函數數組。 每個function都會依次調用。 這是一個 Ajax 事件。

Answer 3

jQuery 想知道期望什么樣的數據作為響應，否則它不知道如何解析它。

因此，如前所述，您使用dataType = 'json'屬性告訴 jQuery。

function getList() {
    $.ajax({  
        type: "GET", 
        url: 'test.php', 
        data: "",  
        dataType: "json",
        success: function(data) { 
            console.log(data);
        }
    });
}

最重要的是，讓 PHP 將其內容顯示為 json 而不是 html 是個好主意。為此，您可以通過設置header('Content-type: application/json');使用 header。 在您的 PHP 腳本中的任何 output 之前。 所以：

$names = array('john doe', 'jane doe');
$ids = array('123', '223');

$data['names'] = $names;
$data['ids'] = $ids;

header('Content-type: application/json');

echo json_encode($data);

Answer 4

您應該在單個 object 中傳遞 ajax() function 的所有參數。因此，應該有“dataType”選項。 此外，如果您明確設置數據類型，jQuery 將為您解析 JSON 數據。 完成回調將接收解析后的 JavaScript object 作為參數。

function getList() {
    $.ajax({  
        type: "GET", 
        url: 'test.php', 
        data: "",  
        dataType: "json",
        success: function(test) { 
            alert(test.names[0]);
            alert("here");
        }
    });
}