2016-12-15 54 views
2

我試圖在我的網頁中實現一個API。但是,由於某種原因,沒有數據正在顯示。我做了一個類似的事情,就像我以前的API一樣,它不起作用。jQuery的API問題

下面是我的代碼:

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Title</title> 
 
    <script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
<script language="JavaScript" type="text/javascript"> 
 
    $(function() { 
 
     var req = $.ajax({ 
 
      url: "http://api.lmiforall.org.uk/api/v1/soc/search?q=computer" 
 
     }); 
 

 
     console.log(data); 
 

 
     req.done(function (data) { 
 
      var wrapperDiv = $("<div />", { 
 
       "class": "wrapper" 
 
      }); 
 

 
      var title = $("<h2 />", { 
 
       text: data[0].title 
 
      }); 
 

 
      wrapperDiv.append(title); 
 

 
      $("body").append(wrapperDiv); 
 
     }); 
 
    }); 
 
</script> 
 
</body> 
 
</html>

隨着API是標題的數據類型,這是一個職位,我想顯示在頁面上的第一個冠軍。然而,無任何顯示,我得到這些錯誤消息:

enter image description here

老實說,我不知道什麼是錯。任何幫助將非常感激。

回答

1

您將「數據」記錄在「完成」方法範圍之外。嘗試這樣的:

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
    <meta charset="UTF-8"> 
 
    <title>Title</title> 
 
    <script language="JavaScript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
</head> 
 
<body> 
 
<script language="JavaScript" type="text/javascript"> 
 
    $(function() { 
 
     var req = $.ajax({ 
 
      url: "http://api.lmiforall.org.uk/api/v1/soc/search?q=computer" 
 
     }); 
 

 
     req.done(function (data) { 
 

 
      console.log(data); 
 

 
      var wrapperDiv = $("<div />", { 
 
       "class": "wrapper" 
 
      }); 
 

 
      var title = $("<h2 />", { 
 
       text: data[0].title 
 
      }); 
 

 
      wrapperDiv.append(title); 
 

 
      $("body").append(wrapperDiv); 
 
     }); 
 
    }); 
 
</script> 
 
</body> 
 
</html>

+1

謝謝你固定它。 – Mechazawa