使用Javascript无效的表格填充

时间:2015-07-01 14:45:20

标签: javascript html json

我正在尝试使用JavaScript使用来自JSON数组的数据填充HTML中的表。我的代码如下:

<head>
        <title>Employee page</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    </head>
    <body>
        <p id="demo"></p>
        <div id="tableData"></div>
        <script type="text/javascript">
            var json_arr = {{ data_arr|safe }};
            var tableData = '<table>';
            tableData += '<th>' + "Serial no." + '</th>';
            tableData += '<th>' + "Name" + '</th>';
            tableData += '<th>' + "Age" + '</th>';
            for (var i=0;i<json_arr.length;i++){
                alert("Hello world!!");
                var obj = json_arr[i];
                alert(obj.id);
                tableData += '<tr>';
                tableData += '<td>' + odj.id + '</td>';
                tableData += '<td>' + odj.name + '</td>';
                tableData += '<td>' + obj.age + '</td>';
                tableData += '</tr>';
            }
            tableData += '</table>';
            document.getElementById("demo").innerHTML = tableData;
            $('#tableData').html(tableData);
        </script>
    </body>

JSON数据正确地传入JS。循环中的问题在于&#34; tableData + =&#39;&#39; + odj.id +&#39;&#39;;&#34; (也可能此后)。我不知道如何解决它。 HTML中没有表格。有人可以建议如何解决这个或至少另一种方法来做到这一点?在此先感谢!!!

0 个答案:

没有答案