使用 Javascript 在 HTML 中显示来自 AJAX 的多行数组

Question

我正在通过 Cordova 构建一个移动应用程序，但在显示我用来通过 AJAX 从数据库获取数据的数组时遇到问题。我已经让 php 努力生成我认为格式正确的数组，但它正在被破坏并变成 "object, object" 沿线的某个地方。

我也不太确定是否真的将该数据放入 html，因为这是我第一次在 javascript 中这样做（通常只使用 php），但是这不如正确地传输该死的数据重要。

HTML/Javascript:

<body onload="getList();">
<div class="app">

<div id="output">If you can see this text something has gone wrong. </div>

<script language="javascript" type="text/javascript">
function getList(){

    $.ajax({
        url: "***.php",
        data: "",
        dataType: 'json',
        success: function(data)
        {
            alert("unparsed data"+data);
            data = JSON.parse(data);
            alert("parsed data"+data);

            for (var x = 0; x < data.length; x++) {
                content = data[x].PID;
                content += "<br>";
                content += data[x].name;
                content += "<br>";
                $("#output").append(content);
            }
        },
        error: function(jqXHR, textStatus)
        {
            alert( "Request failed: " + textStatus );
        }
    });
};
</script>
</div>

生成数组的php文件是

$results_array = array();
$results = mysqli_query($db_server, $query); 

while($row = mysqli_fetch_row($results)){
$table_data[]= array("PID"=>$row[1],"name"=>$row[3]);
}
echo json_encode($table_data);

在浏览器中运行时生成

[{"PID":"11","name":"testname"},{"PID":"11","name":"Dev2test"}]

但是当我运行实际的应用程序时，ajax 成功函数中的第一个警报返回

"unparsed data[object Object],[object Object]"

但是第二个警报没有触发，html 也没有附加任何内容。

Answer 1

因为您在查询中指定了 dataType: 'json'，所以返回的响应已经被解析为 JSON，因此您不需要使用 JSON.parse.

它没有像我想象的那样到达第二个警报JSON.parse(data)由于数据已经是一个对象而发出错误。

使用 Javascript 在 HTML 中显示来自 AJAX 的多行数组

Displaying multi-row array from AJAX in HTML with Javascript

javascript

php

ajax

jquery

cordova