使用ajax获取json以显示给用户

时间:2015-04-13 09:00:33

标签: php mysql ajax json

这是我的PHP代码获取为json工作正常并显示json数据,因为我检查了它。但是当我希望将相同内容显示给用户时不显示。

<?php>
    include('connect.php');
    header("Access-Control-Allow-Origin: *");
    header("Content-Type: application/json; charset=UTF-8");

    $result = $conn->query("SELECT filmName, url, filmYear FROM table");

    $outp = "[";
    while($rs = $result->fetch_array(MYSQLI_ASSOC)) {
        if ($outp != "[") {$outp .= ",";}
        $outp .= '{"Film":"'  . $rs["filmName"] . '",';
        $outp .= '"Path":"'   . $rs["url"]        . '",';
        $outp .= '"Year":"'. $rs["filmYear"]     . '"}'; 
    }
    $outp .="]";

    $conn->close();

    echo($outp);
    ?>

在这里,我传递url以getfilms.php的形式向用户提取数据,其中包含上述代码。

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <link href="site.css" rel="stylesheet">
</head>
<body>

<nav id="nav01"></nav>

<div id="main">
  <h1>films</h1>
  <div id="id01"></div>
</div>

<script>
    var xmlhttp = new XMLHttpRequest();
    var url = "getfilms.php";
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            myFunction(xmlhttp.responseText);
        }
    }
    xmlhttp.open("GET", url, true);
    xmlhttp.send();

    function myFunction(response) {
        var obj = JSON.parse(response);
        var arr = obj.records;
        var i;
        var out = "<table><tr><th>Film</th><th>Path</th><th>Year</th></tr>";

        for (i = 0; i < arr.length; i++) {
            out += "<tr><td>" +
        arr[i].Film +
        "</td><td>" +
        arr[i].Path +
        "</td><td>" +
        arr[i].Year +
        "</td></tr>";
        }
        out += "</table>"
        document.getElementById("id01").innerHTML = out;
    }
</script>

</body>
</html>

2 个答案:

答案 0 :(得分:0)

谢谢你@twicejr它工作得很好。我代表你发布答案。

注释掉这一行:“var arr = obj.records”。将'var obj ='替换为'var arr =' - 您已经在obj变量上定位了一个未定义的索引(obj上的json数组中不存在记录)

var arr = JSON.parse(response);
        //var arr = obj.records;

答案 1 :(得分:0)

你的构建json这不是一个好方法。

制作一个数组,然后简单回显json_encode(Your_array);

这给你一个完美的json格式。

解析json值请使用此..

var result = $ .parseJSON(response);

使用此 result.value;