javascript 如何正确读取json文件？[关闭]

ddarikpa 于 2023-01-16 发布在 Java

关注(0)|答案(1)|浏览(99)

已关闭。此问题需要details or clarity。当前不接受答案。
**想要改进此问题？**添加详细信息并通过editing this post阐明问题。

8小时前关门了。
Improve this question
我尝试在 AJAX 调用后读取下面的json文件. json文件应该是php页面的结果，php页面生成它并将其发送到html页面，html页面接收它并将其显示在一个表格中.考虑到这是一个学习如何使用ajax的练习，我没有这样的php页面，但我只是使用VsCode上的“Live Server”扩展来读取json文件，我的问题是如何读取json文件并将其放入html表中？

Json文件：

{
    "employees": [
        {
            "id":1,
            "name":"name1",
            "surname":"surname1",
            "salary":10000
        },

        {
            "id":2,
            "name":"name2",
            "surname":"surname2",
            "salary":2000
        },

        {
            "id":3,
            "name":"name3",
            "surname":"surname3",
            "salary":2000
        },

        {
            "id":4,
            "name":"name4",
            "surname":"surname4",
            "salary":2000
        }
    ]
}

html文件：

<!DOCTYPE html>
<html>
        <script type="text/javascript"     src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <head>
        <title>Test JSON</title>
    </head>

    <body>
        <div>
            <table id="content">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>NAME</th>
                        <th>SURNAME</th>
                        <th>SALARY</th>
                    </tr>
                </thead>

                <tbody id="emp">
                </tbody>
            </table>
        </div>

        <script type="text/javascript">
            $.ajax({
                url: "output.json",
                type:"GET",
                dataType:"json",
                success: function (data) {
                    var json = JSON.parse(data.d);
                    $(json).each(function (index, item){
                        ID = json[index].id;
                        NAME = json[index].name;
                        SURNAME = json[index].surname;
                        SALARY = json[index].salary;
                        $('tbody#emp').append(
                            '<tr>' +
                                '<td>' + ID + '</td>' + 
                                '<td>' + NAME+ '</td>' + 
                                '<td>' + SURNAME+ '</td>' + 
                                '<td>' + SALARY + '</td>' + 
                            '</tr>'          
                        )
                    });  
                    
                },
                error: function (data) { alert("help"); }
            });
        </script>
    </body>
</html>

最终结果应该是如下所示的html表：

| 识别号|姓名|姓氏|薪金|
| - ------|- ------|- ------|- ------|
| 1个|名称1|姓1|一万|
| 第二章|名称2|姓2|二○ ○ ○年|
| 三个|名称3|姓氏3|二○ ○ ○年|
| 四个|名称3|姓4|二○ ○ ○年|

先谢谢你
**UPDATE：**它在第32行或以下行给我错误

SALARY = json[指数].薪金;
错误如下x1c 0d1x

JavaScript

来源：https://stackoverflow.com/questions/75118442/how-could-i-read-the-json-file-correctly

1条答案

按热度按时间

e5nqia271#

AJAX 返回一个已解析的对象，因此当您尝试使用JSON.parse(data.d)解析它时会失败。
此外，您似乎忘记了要显示的数组位于employees键下。
以下是成功回调的更正版本：

success: function (data) {
  var employees = data.employees;
  $(obj).each(function (index, item) {
    ID = employees[index].id;
    NAME = employees[index].name;
    SURNAME = employees[index].surname;
    SALARY = employees[index].salary;
    $('tbody#emp').append(
      '<tr>' +
      '<td>' + ID + '</td>' +
      '<td>' + NAME + '</td>' +
      '<td>' + SURNAME + '</td>' +
      '<td>' + SALARY + '</td>' +
      '</tr>'
    )
  });
}

赞(0）回复(0）举报 2023-01-16

我来回答

javascript 如何正确读取json文件？[关闭]

1条答案

相关问题

热门标签

最新问答