Question

显示json数据的代码

$('body').on('click','#check_history',function () {
var settings = {
                    "async": true,
                    "crossDomain": true,
                    "url": "https://url.com",
                    "method": "POST",
                    "headers": {
                        "content-type": "application/x-www-form-urlencoded",
                        "cache-control": "no-cache",
                        "postman-token": "bla-bla-bla-bla"
                    },
                    "data": {
                        "userid": "this-is-userid",
                        "to": "destination",
                        "count": "5"
                    }
                }
    $.ajax(settings).done(function (response) {
    console.log(response);
     //I think I need some code here
    });
});

我在控制台的AJAX中获得了以下JSON响应

    {
    "status": 0,
    "trxid": "101010101",
    "billpayQueryState": false,
    "billpayState": false,
    "trxList": [{
        "date": "16/1/2017 11:51",
        "transid": 1010101010,
        "type": "merchant_buy",
        "amount": 3500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 11:25",
        "transid": 2020202020,
        "type": "merchant_buy",
        "amount": 4500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 11:5",
        "transid": 3030303030,
        "type": "merchant_buy",
        "amount": 4500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 10:55",
        "transid": 4040404040,
        "type": "merchant_buy",
        "amount": 5000,
        "agent": "abc"
    }, {
        "date": "16/1/2017 10:39",
        "transid": 5050505050,
        "type": "merchant_buy",
        "amount": 5500,
        "agent": "abc"
    }],
    "agentData": {
        "walletType": 0,
        "isWaitingForKyc": false,
        "isAllowToKyc": false,
        "isOutlet": false
    }
}

我需要将上面的JSON数据显示到人类易于阅读的表格或html中。我在很多方面尝试过google＆amp; stackoverflow，但还没有解决我的问题。我该怎么做？请帮忙！

Answer 1

简单映射响应并将数据附加到表中。

＆＃13;

$(function() {
  var response =  {
    "status": 0,
    "trxid": "101010101",
    "billpayQueryState": false,
    "billpayState": false,
    "trxList": [{
        "date": "16/1/2017 11:51",
        "transid": 1010101010,
        "type": "merchant_buy",
        "amount": 3500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 11:25",
        "transid": 2020202020,
        "type": "merchant_buy",
        "amount": 4500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 11:5",
        "transid": 3030303030,
        "type": "merchant_buy",
        "amount": 4500,
        "agent": "abc"
    }, {
        "date": "16/1/2017 10:55",
        "transid": 4040404040,
        "type": "merchant_buy",
        "amount": 5000,
        "agent": "abc"
    }, {
        "date": "16/1/2017 10:39",
        "transid": 5050505050,
        "type": "merchant_buy",
        "amount": 5500,
        "agent": "abc"
    }],
    "agentData": {
        "walletType": 0,
        "isWaitingForKyc": false,
        "isAllowToKyc": false,
        "isOutlet": false
    }
}
  $.map(response.trxList, function(val, i) {
    var htm = '<tr><td>' + val.date + '</td><td>' + val.transid + '</td><td>' + val.type + '</td><td>' + val.amount + '</td><td>' + val.agent + '</td></tr>';
    $('#table').append(htm);
  })
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table id="table"></table>

＆＃13;

显示来自ajax的JSON响应，如HTML或表

1 个答案: