如何以正确的方式显示JavaScript响应?

时间:2015-04-29 05:58:25

标签: javascript html json

以下是我调用服务器API的JavaScript代码:

<script type='text/javascript'>
  call_juvlon_api(apikey, 'getAvailableCredits', '', function(response) {
     document.getElementById('show').innerHTML=response;
  });   
</script>

当我在HTML标记中打印响应时:

<h1 id='show'></h1>

我以这种格式获得结果:

{"code":"200","status":"Success:Mail Credit Details","Mail Credits":"46"}

但我想要的是这样的结果:

<h1>code:200</h1>
<h1>status:Success:Mail Credit Details</h1>
<h1>Mail Credits:46</h1>

我尝试了以下操作,但没有显示任何内容:

var obj=['show'] 

var tbl=$("<table/>").attr("id","mytable");
$("#div1").append(tbl);
for(var i=0;i<obj.length;i++)
{
    var tr="<tr>";
    var td1="<td>"+obj[i]["code"]+"</td>";
    var td2="<td>"+obj[i]["status"]+"</td>";
    var td3="<td>"+obj[i]["color"]+"</td></tr>";

    $("#mytable").append(tr+td1+td2+td3);
}

1 个答案:

答案 0 :(得分:0)

首先,你需要3个h1元素,所以将'show'元素更改为这样的div;

<div id='show'></div>

然后在您的javascript代码中,按照其名称访问响应元素;

<script type='text/javascript'>
   call_juvlon_api(apikey, 'getAvailableCredits', '', function(response) {
    var obj = JSON.parse(response);
    for(var prop in obj) {
       document.getElementById('show').innerHTML += '<h1>' + prop + ":" + obj[prop] + '</h1>';
    }
});