Instagram jQuery Search没有显示任何内容

时间:2014-02-16 21:08:23

标签: javascript jquery html search instagram

我是一名新手程序员,我一直在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=?&amp;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>

0 个答案:

没有答案