试图在html中显示ajax响应

Question

我正在尝试显示每次在页面底部滚动时从控制器收到的一些ajax响应。

if($(window).scrollTop() == $(document).height() - $(window).height()){
    load++;

    $.ajax({
            type: 'POST',
            url: 'get-response',
            dataType: 'json',
            data: {
                "load" : load,
                "key" : key
            },
            success: function(response){
                var out = "";
                var i;
                for(i=0;i<response.length;i++){
                    out += response[i];
                }
                document.getElementById("response").innerHTML = out;

            }
        });
}

我得到的响应是JSON格式，如下所示：

我不确定如何遍历结果并在每次返回结果时附加html中显示它。任何人都可以帮助我在本节中写下的其他内容以显示结果吗？

success: function(response){
                var out = "";
                var i;
                for(i=0;i<response.length;i++){
                    out += response[i];
                }
                document.getElementById("response").innerHTML = out;

            }

Answer 1

试试这个，我添加了table实施，您可以更改为div

    var out = "<table>";
    var i;
    for(i=0;i<response.length;i++){
        out +='<tr>';
        out +='<td>'+response[i].brand_name+'</td>';
        out +='<td>'+response[i].product_name+'</td>';
        out +='<td>'+response[i].selling_price+'</td>';
        out +='<td>'+response[i].mark_price+'</td>';
        out +='</tr>';
        out += response[i];
    }
    out += "</table>";

Answer 2

如果通过在json中显示对象没有问题，则只需编写

即可

JSON.stringify(response[i])

或者你可以使用另一个for循环

for(var x: response[i]){...}

Answer 3

这应该用空格缩进“漂亮打印”，适合在HTML中查看：

success: function(response){
    $("#response").html(JSON.stringify(response, null, '&nbsp').replace(/\n/g, '<br>'));
    $("#response").css('font-family', 'courier');
};