jQuery解析JSON響應

Question

我已成功發布到PHP文件，並獲得了良好的答復。 我似乎無法理解的部分是將其解析然后顯示在頁面上。 這是我在驗證處理程序中的javascript：

submitHandler: function(form) {
    var formData = $(form).serialize();
    $.post('http://test.php', formData, function(data) {
        if(data.success) {
            $('#load').show();
            var response = i;
            $('#load').hide();
            //var msg = '';
            for(var i = 0; i < x.flights.length; i++) {
               msg += '<span>';
               msg += '<p>Flight Number: ' + x.flights[i].flight_number + '</p>';
               msg += '<p>Cost: ' + x.flights[i].cost + '</p>';
               msg += '</span>';
            }
            //this is were I think it should display. but It's not working

            $('#load').html(msg);

這是我的json響應：

   success
true

 message
"Success"

flights
[Object { flight_number="334", cost="983.40", departure_city="Kearney Regional Airpor...arney, Nebraska - (EAR)", more...}]

0
Object { flight_number="334", cost="983.40", departure_city="Kearney Regional Airpor...arney, Nebraska - (EAR)", more...}

flight_number
"334"

cost
"983.40"

departure_city
"Kearney Regional Airport, Kearney, Nebraska - (EAR)"

arrival_city
"Chadron Muni Airport, Chadron, Nebraska - (CDR)"

departs
"2014-03-19 04:33:00"

arrives
"2014-03-19 08:12:00"

duration
"219"

adult_seats_available
"2"

senior_seats_available
"1"

我知道您沒有看到JSON響應，但可以在FF firebug中看到它。 我是jQuery / JSON的新手，我只想將響應打印到我的頁面上。 提前致謝。

Answer 1

查看JSON.stringify(data) 文檔，我不知道您想在哪里顯示JSON，但是如果您只想查看它的內容，請打開調試器和console.log(JSON.stringify(data)); 應該這樣做。

Answer 2

您正在使用post方法，它可能默認返回xml，json，腳本，文本，html。 因此，您正在從post方法獲取數據。

嘗試查看https://api.jquery.com/jQuery.post/

如果要訪問它，則可以使用JSON.stringify（data）將json顯示為字符串。 要從json訪問數據，您可以使用點（。）表示法。

Answer 3

這里有幾件事情要看。

首先，您將html（即msg ）添加到#load元素（ $('#load').html(msg); ）中，但在代碼的前面，您將其隱藏（ $('#load').hide(); ）。 因此，我認為這將回答您的主要問題； 即刪除行$('#load').hide(); 或添加$('#load').show(); 在$('#load').html(msg); 。

還是沒看到什么？ 然后，響應可能不如您所聲稱的那么正確，因此，檢查分配給msg內容的一種更簡單的方法可能是提醒html alert(msg); <-構建html后進行此調用。

因此，除了使用#load元素外，您似乎正在使用它來保存加載的gif，還通過msg的內容為其分配了響應。 也許您需要分開使用元素，以便#load元素用於加載gif，並為響應添加另一個元素。 所以你的代碼更像這樣。

html

<div id="load" class="hide"><img src="loading-animation.gif">...</div>
<div id="post-response" class="hide alert"><div>

隱藏類不顯示 ， 警報類表示響應警報的樣式。

js

submitHandler: function(form) {

    // show the loading gif before we make the 
    // post data and wait for an async response
    $('#load').show();

    ...
    $.post('http://test.php', formData, function(data) {
        if(data.success) {

            // post-back has completed so lets hide the animation
            $('#load').hide();

            // your code to build html msg

            // assign and show the response element
            $('post-response').html(msg);
            $('post-response').show();
            ...