如何使用 jQuery / JavaScript 解析 JSON 数据？

小编典典

如何使用 jQuery / JavaScript 解析 JSON 数据？

all

我有一个 AJAX 调用，它返回一些像这样的 JSON：

$(document).ready(function () {
    $.ajax({ 
        type: 'GET', 
        url: 'http://example/functions.php', 
        data: { get_param: 'value' }, 
        success: function (data) { 
            var names = data
            $('#cand').html(data);
        }
    });
});

在#canddiv 里面我会得到：

[ { "id" : "1", "name" : "test1" },
  { "id" : "2", "name" : "test2" },
  { "id" : "3", "name" : "test3" },
  { "id" : "4", "name" : "test4" },
  { "id" : "5", "name" : "test5" } ]

如何遍历这些数据并将每个名称放在一个 div 中？

阅读 74

2022-06-28

共1个答案

小编典典

假设您的服务器端脚本没有设置正确的响应标头，您需要使用参数Content-Type: application/json向 jQuery 指示这是
JSON 。dataType: 'json'

然后您可以使用该$.each()函数循环遍历数据：

$.ajax({ 
    type: 'GET', 
    url: 'http://example/functions.php', 
    data: { get_param: 'value' }, 
    dataType: 'json',
    success: function (data) { 
        $.each(data, function(index, element) {
            $('body').append($('<div>', {
                text: element.name
            }));
        });
    }
});

或使用以下$.getJSON方法：

$.getJSON('/functions.php', { get_param: 'value' }, function(data) {
    $.each(data, function(index, element) {
        $('body').append($('<div>', {
            text: element.name
        }));
    });
});

2022-06-28