我是一名新手程序员,我一直在EduVoyage(http://eduvoyage.com/instagram-search-app.html)阅读Instagram搜索教程。对此印象深刻,我决定尝试用它来学习jquery等。问题是,我无法得到他的榜样。我把我的应用程序缩小了,可以让它显示默认的“猫”搜索,但是当我在网络表单上搜索时,我什么都没得到。没有错误,没有结果,没有。我在这里试图找出我做错了什么。我知道它可能是一些简单的遗漏,但任何帮助都非常感谢。
这是js代码:
var Instagram = {};
(function () {
function toScreen(photos) {
$.each(photos.data, function (index, photo) {
photo = "<div class='photo'>" +
"<a href='" + photo.link + "' target='_blank'>" +
"<img class='main' src='" + photo.images.low_resolution.url + "' width='250' height='250' />" +
"</a>" +
"<img class='avatar' width='40' height='40' src='" + photo.user.profile_picture + "' />" +
"<span class='heart'><strong>" + photo.likes.count + "</strong></span>" +
"</div>";
$('div#photos-wrap').prepend(photo);
});
}
function search(tag) {
var url = "https://api.instagram.com/v1/tags/" + tag + "/media/recent?callback=?&client_id=XXXXXXXXXXXXXXXXXX"
$.getJSON(url, toScreen);
}
$(function () {
$('form#search button').click(function () {
var tag = $('input.search-tag').val();
Instagram.search(tag);
});
Instagram.search('cats');
});
Instagram.search = search;
})();
和HTML
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript' charset='utf-8'></script><script src='javascripts/application.js' type='text/javascript' charset='utf-8'></script>
<link href="stylesheets/application.css" media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
<div id='photos-wrap'>
<form id='search'>
<button type='submit' id='search-button' tabindex='2'>
<span class='button-content'>Search</span>
</button>
<div class='search-wrap'>
<input class='search-tag' type='text' tabindex='1' />
</div>
</form>
</div>
</body>
</html>