2016-12-15 2 views
2

Я пытаюсь реализовать API на своей веб-странице. Однако по какой-либо причине ни одна из данных не отображается. Я сделал то же, что и в предыдущем API, и он не работает.Проблемы с API с jQuery

Ниже мой код:

<!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

Вы регистрируете «данные» вне области действия «done». попробуйте так:

<!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