Question

这是我第一次在这里发布信息，但我迫切需要一个解决方案。如果我的问题格式不正确，请您提前抱歉。所以基本上我正在努力的是将json数据附加到html中的段落中。我的API可以，我用console.log检查了数据，但是每次尝试追加数据时，控制台都会弹出一个错误消息：Uncaught TypeError：无法读取未定义的属性“ Drivers”。

我试图从函数中删除MRData，但是似乎没有任何作用。

     $.getJSON("http://ergast.com/api/f1/2016/drivers.json", function(MRData) {
        console.log(MRData);
        var drId = MRData.DriverTable.Drivers[0].driverId;
        var permanentNum = MRData.DriverTable.Drivers[0].permanentNumber;
        var kod = MRData.DriverTable.Drivers[0].code;
        $('#p0').append(drId);
        $('#p1').append(permanentNum);
        $('#p2').append(kod);
   })
    <body>
          <p id="p0"></p>
          <p id="p1"></p>
          <p id="p2"></p>
    </body>

我希望在这里完成的工作是从每个变量中获取字符串，并将其附加到我的段落中。

Answer 1

问题是您认为结果数据是MRData，但是它是一个保存MRData的对象。

data = {
    MRData: {...}
}

访问MRData将使您的代码正常工作。

$.getJSON("http://ergast.com/api/f1/2016/drivers.json", function(data) {
  //data is an object which will have MRData inside.
  var MRData = data.MRData;
  var drId = MRData.DriverTable.Drivers[0].driverId;
  var permanentNum = MRData.DriverTable.Drivers[0].permanentNumber;
  var kod = MRData.DriverTable.Drivers[0].code;
  $('#p0').append(drId);
  $('#p1').append(permanentNum);
  $('#p2').append(kod);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
  <p id="p0"></p>
  <p id="p1"></p>
  <p id="p2"></p>
</body>

Answer 2

您必须使用

var MRData =data.MRData;
        console.log(data.MRData);
        var drId = MRData.DriverTable.Drivers[0].driverId;
        var permanentNum = MRData.DriverTable.Drivers[0].permanentNumber;
        var kod = MRData.DriverTable.Drivers[0].code;
        $('#p0').append(drId);
        $('#p1').append(permanentNum);
        $('#p2').append(kod);
   })

您的收款人数据具有字段MRData，而您使用var MRData =data.MRData;

Answer 3

在json文件中，您有一个变量mrData，因此您的开始应该是

MRData.MRData.DriverTable.Drivers

如果您查看自己的json文件，则显示为

{ 
  MRData={}
}

添加MRData= MRData.MRData;应该可以解决此问题。或者您可以简单地将jsonfile内容修改为{DriverTable:{// bla bla bla }}

    $.getJSON("http://ergast.com/api/f1/2016/drivers.json", function(MRData) {
        console.log(MRData);
        MRData= MRData.MRData; // here is a simple workout
      
        var drId = MRData.DriverTable.Drivers[0].driverId;
        var permanentNum = MRData.DriverTable.Drivers[0].permanentNumber;
        var kod = MRData.DriverTable.Drivers[0].code;
        $('#p0').append(drId);
        $('#p1').append(permanentNum);
        $('#p2').append(kod);
        
   })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<body>
          <p id="p0"></p>
          <p id="p1"></p>
          <p id="p2"></p>
    </body>

无法读取未定义的属性“驱动程序”

3 个答案: