javascript - 使用 $.getJSON 将 JSON 对象从数据库传递到 JS

Question

我正在尝试使用 $.getJSON 函数将通过 php 文件从数据库访问的 json 对象传递到 JS 中。我为此使用 json_encode() 函数。正在检索数据库中存储的 json 对象。但是，我在 php ($arr) 中获取的数组未被 $.getJSON 函数接受。

请帮忙。谢谢!

示例代码(php):

<?php 
    $arr = array();
    while($row = mysqli_fetch_array($result)){
        $attributes = $row['attributes'];
        array_push($arr, $attributes);
    }

    $newArray = json_encode($arr);
    echo $newArray;
?>

JS代码:

var i, j;
var dataset = [];
for (i=0; i < 17; i++){
    dataset[i] = [];
    for (j=0; j < 17; j++){
        dataset[i][j] = "";
    }
}
$(document).ready(function(){

    $.getJSON('getData.php', function(data) {                        
        $.each(data, function(key, val) {
            var x = val.posX,
            y = val.posY;
        });
    });
});

以下是我打印 $newArray 时的输出。

[
    "{\"position\":\"6.5\",\"posX\":6,\"posY\":5,\"type\":\"wall\"}",
    "{\"position\":\"1.2\",\"posX\":1,\"posY\":2,\"type\":\"wall\"}",
    "{\"position\":\"3.5\",\"posX\":3,\"posY\":5,\"type\":\"bee\",\"speed\":12}",
    "{\"position\":\"7.3\",\"posX\":7,\"posY\":3,\"type\":\"bee\",\"speed\":12}",
    "{\"position\":\"0.0\",\"posX\":0,\"posY\":0,\"type\":\"butterfly\",\"speed\":12,\"minspeed\":3.5,\"maxspeed\":12,\"speed_change_rate\":-0.9}",
    "{\"position\":\"4.0\",\"posX\":4,\"posY\":0,\"type\":\"butterfly\",\"speed\":12,\"minspeed\":3.5,\"maxspeed\":12,\"speed_change_rate\":-0.9}"
]

Answer 1

这里的基本问题是您将 JSON 存储在数据库中，而不是设计一个数据库来保存您正在处理的数据。

即您的数据库表应该包含位置、posX 等列。

因此，当您将数据返回到浏览器时，您将返回一个 JSON 字符串数组，其中每个字符串本身就是一个 JSON 文本。

为了解决这个问题，您必须在循环遍历每个字符串时解析它们。

    $.each(data, function(key, val) {
        val = JSON.parse(val);
        var x = val.posX,

更好的方法是在返回服务器上的每个字符串之前对其进行解码。

最好的方法是标准化您的数据库，以便您拥有可以实际查询的数据。