Question

我有一个PHP函数，可以回显JSON数据和分页链接。数据看起来完全像这样。

[{"name":"John Doe","favourite":"cupcakes"},{"name":"Jane Citizen","favourite":"Baked beans"}]
Previous
Next

要获取这些数据，我会使用jQuery.ajax（）函数。我的代码如下： -

function loadData(page){                
    $.ajax
    ({
        type: "POST",
        url: "http://sandbox.dev/favourite/test",
        data: "page="+page,
        success: function(msg)
        {
            $("#area").ajaxComplete(function(event, request, settings)
            {
                $("#area").html(msg);
            });
        }
    });
}

使用jQuery，无论如何我可以抓取从AJAX请求返回的数据并使用JSON数据吗？或者有更好的方法吗？我只是在尝试并希望对JSON数据进行分页。

Answer 1

最好不要为这些事情发明自己的格式（比如在JSON之后添加HTML链接）。 JSON已经能够保存您需要的任何结构。例如，您可以使用以下形式：

{
    "data": [
        {"name": "John Doe", "favourite": "cupcakes"},
        {"name": "Jane Citizen", "favourite": "Baked beans"}
    ],
    "pagination": {
        "prev": "previous page URL",
        "next": "next page URL"
    }
}

在客户端，它可以很容易地解析：

$.ajax({
    url: "URL",
    dataType:'json',
    success: function(resp) { 
        // use resp.data and resp.pagination here
    }
});

Answer 2

将 dataType 添加到您的ajax请求以接收 json对象，否则您将收到一个字符串。

如果你在你的json中加上“previous”和“next”，那将是无效的。

function loadData(page){                
    $.ajax({
        type: "POST",
        url: "http://sandbox.dev/favourite/test",
        data: {'page':page},
        dataType:'json',
        success: function(msg){ 
            if(typeof (msg) == 'object'){
              // do something... 
            }else{
              alert('invalid json');
            }
        },
        complete:function(){ 
           //do something
        }
    });
}

和..在你的php文件中，放一个标题

header("Content-type:application/json");
// print your json..

要查看您的json对象...请使用console.log，如下所示：

// your ajax....
success:(msg){
if( window.console ) console.dir( typeof(msg), msg);
}

将您的json更改为以下内容:(使用jsonlint验证它 - http://jsonlint.com/）

{
    "paginate": {
        "previous": "http...previsouslink",
        "next": "http...nextlink"
    },
    "data": [
        {
            "name": "JohnDoe",
            "favourite": "cupcakes"
        },
        {
            "name": "JaneCitizen",
            "favourite": "Bakedbeans"
        }
    ]
}

Answer 3

我建议您返回纯JSON数据，而不是抓取JSON数据。根据您的使用案例，我认为不必编写Previous和Next。我猜你的回复网址中的第一个对象是Previous，下一个对象是Next。只需返回以下字符串......

[{"name":"John Doe","favourite":"cupcakes"},{"name":"Jane Citizen","favourite":"Baked beans"}]

并在下面阅读。

function loadData(page){                
    $.ajax
    ({
        type: "POST",
        url: "http://sandbox.dev/favourite/test",
        dataType:'json',
        success: function(msg)
        {
            var previous = msg[0];  //This will give u your previous object and
            var next = msg[1]; //this will give you your next object

            //You can use prev and next here.

            //$("#area").ajaxComplete(function(event, request, settings)
            //{
            //    $("#area").html(msg);
            //});
        }
    });
}

这样只返回那些不会改变整个html的数据。

Answer 4

你可以试试这个： -

var jsObject = JSON.parse(your_data);

data = JSON.parse(gvalues);
var result = data.key;
var result1 = data.values[0];

从AJAX请求中刮取JSON数据

4 个答案: