Question

我有一个运行SQL查询的PHP脚本。我想将结果放在一个数组中，将其编码为JSON对象，将其回送给调用它的Javascript，并将其用作数组来编写一些HTML。

这是使用POST调用PHP脚本的JS。我尝试使用JSON.parse(data)解析回显的数据（我也尝试jQuery.parseJSON(data) - 不确定是否存在差异），并在HTML页面上显示原始回显数据以进行测试。

var components = [];    // create empty array for component list
if ($('#area').val) {   // if area contains a value and isn't zero (i.e. an area has been selected)
    $.post("/basic/get_area_components.php"
    ,{area: $("#area").val()}
    ,function(data){ components = JSON.parse(data);
        $("#components_raw").html(data);
        $("#components").html(components);
    });
}

PHP脚本（在设置数据库连接之后）如下所示：

$result = $conn->query("SELECT Component FROM ConfigComponent WHERE Parent =" . $area);

while($row = $result->fetch_array()) {
    $rows[] = $row;
}

$i = 1;
foreach ($rows as $value) {
    $components[$i] = $value[0];
    $i++;
}

echo json_encode($components);

当我运行脚本时，我在HTML页面上获得原始输出，如下所示：

{"1":"Handlebar","2":"Stem","3":"Headset","4":"Fork"}

它似乎是一个格式正确的JSON对象，但没有来自已解析的components数组，也没有例外。我尝试使用forEach扫描数组并单独打印或警告元素，但无济于事。

如何正确解析JSON对象并在Javascript中使用它？这是JS解析或PHP编码的问题吗？

Answer 1

这种行为很正常。 Javascript仅支持索引数组。因为php中的索引以1而不是0开头，所以它变成了一个关联数组而不是索引数。

$i = 0; // start with 0
foreach ($rows as $value) {
    $components[$i] = $value[0];
    $i++;
}

或

   foreach ($rows as $value) {
      // or don't use an index when adding a value to the array         
      $components[] = $value[0];
   }

这将产生一个json数组 [ “车把”， “干”， “耳机”， “叉”]

Answer 2

有趣的问题。在Js中：

{"1":"Handlebar","2":"Stem","3":"Headset","4":"Fork"}

不再是数组。它是一个对象。似乎jQuery实际上忽略了传递给.html()方法的对象。它将呈现字符串或执行函数。

所以，你已经做好了它只是没有正确显示到页面上。我建议改用console.log。

Answer 3

尝试定义javascript应该从服务器中获得的数据类型。请尝试以下

$.post("/basic/get_area_components.php",
    {area: $("#area").val()},
    function(data){ 
        var components = JSON.parse(data);
        $("#components_raw").html(data);
        $("#components").html(components);
    },
    "json"); //define expected type here

尝试一下，让我知道它是否适合你。可以找到有关如何使用$.post()的更多信息here

Answer 4

我想你在那里使用jquery所以这可能有所帮助： How do I iterate over a JSON structure?

和是for循环也会这样做：

var componentFormatted;
for (var k in obj){
    componentFormatted += obj[k];
}

然后只需在此处应用任何格式化的输出

$("#components").html

使用JSON

4 个答案: