【发布时间】：2019-05-24 21:23:09
【问题描述】：
我想访问 JSON 文件中存在的数据，它的 URL 存在于 JSON 文件中，解释起来很复杂，所以我会告诉你我想要做什么：
我想访问以获取所有贡献者以及 github 上给定存储库的最后 100 次提交。
为此，我首先访问 :https://api.github.com/search/repositories?q= 链接，通过搜索栏添加存储库名称。
我们以 :bootstrap4-zhcn-documentation 为例，所以我有以下链接：https://api.github.com/search/repositories?q=bootstrap4-zhcn-documentation
我想列出所有贡献者，在贡献者 URL ID 下显示：
之后，我想访问作为 JSON 文件的 URL，并获取登录 ID，在此示例中为：enter image description here
我应该得到“zoomla” 当然，这里我只有一个贡献者，我想把他们都列出来。
问题是：我不知道如何通过 jQuery/Javascript 访问此 URL，打开它，列出所有登录 ID 并显示它们。
这是我的代码，我在贡献者部分有“未定义”，
提前谢谢你。
$(document).ready(function() {
console.log("Ready!");
$("#SearchRep").on("keyup", function(e) {
let repository = e.target.value;
console.log(repository);
$.ajax({
// type: "method",
url: "https://api.github.com/search/repositories?q=" + repository,
data: {
"client-id": "522a9db59ec192e4cf6a",
"client-secret": "4bc5227ec0d26b14193923a1ee80afad19fe2ff6"
}
// dataType: "dataType",
// success: function (response) {
// }
}).done(function(repo) {
$("#repositoryResult").html(`
<h3 class="panel-title">Repository name: ${
repo.items[0].name
} </h3>
<h3> Contributors: ${ repo.items[1].contributors_url.login} </h3>
`);
});
});
});body {
padding-top: 65px;
}<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v3.8.5">
<title>Github Repositories Finder</title>
<!-- Bootstrap core CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet" >
<!doctype html>
<html lang="en" class="h-100">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors">
<meta name="generator" content="Jekyll v3.8.5">
<title>Github Repositories Finder</title>
<!-- Bootstrap core CSS -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" rel="stylesheet">
<style>
.bd-placeholder-img {
font-size: 1.125rem;
text-anchor: middle;
}
@media (min-width: 768px) {
.bd-placeholder-img-lg {
font-size: 3.5rem;
}
}
</style>
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
</head>
<body class="d-flex flex-column h-100">
<header>
<!-- Fixed navbar -->
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<a class="navbar-brand" href="#">Github Repositories Finder</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
</ul>
<div class="searchContainer">
<form class="form-inline mt-2 mt-md-0">
<input class="form-control mr-sm-2" type="text" placeholder= "Search" id="SearchRep" aria-label="Search">
<button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
</form>
</div>
</div>
</nav>
</header>
<!-- Begin page content -->
<main role="main" class="flex-shrink-0">
<div class="container">
<h1 class="mt-5">Github Public Repositories</h1>
</div>
<div id="repositoryResult"></div>
</main>
<script
src="https://code.jquery.com/jquery-3.3.1.js"
integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60="
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" ></script>
<script src="js/main.js"></script>
</body>
</html>【问题讨论】：
标签： javascript jquery json github