Jquery/Javascript Flickr Gallery.. 非常需要帮助

发布于 2025-01-03 05:10:05 字数 1419 浏览 1 评论 0原文

因此，我正在开发一个项目，该项目基本上将用户的输入作为闪烁的“标签”并存储它，然后重用它来制作从标签中提取的闪烁图像的图库。现在我想我已经得到了我想要做的大部分内容...但它只是没有 100% 工作...或者根本没有工作，因为没有任何图像再出现，但这是我的代码，

<head>
    <meta charset="utf-8" />
    <title>Image Gallery</title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script src="js/index.js"></script>

    <script>
        $(function() {

            $("#test").keyup(function(){
                var value = $(this).val()

                $.getJSON(
                    "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
                    {
                        tags: "value",
                        tagmode: "any",
                        format: "json"
                    },
                    function(data) {
                        $.each(data.items, function(i,item){
                            $("<img/>").attr("src", item.media.m).appendTo("#images");
                            if ( i == 20 ) return false;
                        });
                    }
                );
            };
        });
    </script>

</head>
<body>
    <form>
        Input a Tag for Flicker Images: <input id="test" type="text" />
    </form>

    <div id="images"></div>

</body>

看起来好像是这样很简单，但我就是不知道我做错了什么。

原文

So i'm working on a project that basically takes the user's input as a "tag" of sorts for flicker and stores it, to then reuse it to make a gallery of the flicker images it pulls up from the tag. Now I think i've got mostly what i'm trying to do... but It's just not working 100%... or really at all because none of the images show up anymore, but here's my code

<head>
    <meta charset="utf-8" />
    <title>Image Gallery</title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script src="js/index.js"></script>

    <script>
        $(function() {

            $("#test").keyup(function(){
                var value = $(this).val()

                $.getJSON(
                    "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
                    {
                        tags: "value",
                        tagmode: "any",
                        format: "json"
                    },
                    function(data) {
                        $.each(data.items, function(i,item){
                            $("<img/>").attr("src", item.media.m).appendTo("#images");
                            if ( i == 20 ) return false;
                        });
                    }
                );
            };
        });
    </script>

</head>
<body>
    <form>
        Input a Tag for Flicker Images: <input id="test" type="text" />
    </form>

    <div id="images"></div>

</body>

It seems like it's something very simple but I JUST cannot figure out what i'm doing wrong..

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

羁绊已千年 2025-01-10 05:10:05

你缺少一个分号：

var value = $(this).val()

应该是：

var value = $(this).val();

我还会在你的

另一件事是结束标签（最后两个）是：

};
});

应该是

});

这里只是返工：

$(function() {
    $("#test").keyup(function() {
        var value = $(this).val();
        $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", {
            tags: "value",
            tagmode: "any",
            format: "json"
        }, function(data) {
            $.each(data.items, function(i, item) {
                $("<img/>").attr("src", item.media.m).appendTo("#images");
                if (i == 20) return false;
            });
        });
    });
});

这里是一个工作示例：http://jsfiddle.net/MarkSchultheiss/NFRsX/

you are missing a semi colon:

var value = $(this).val()

should be:

var value = $(this).val();

I would also put a type="text/javascript" attribute on your <script> tags

one other thing, the closing tags (last two) are:

};
});

should be

}); ONLY

here is the rework:

$(function() {
    $("#test").keyup(function() {
        var value = $(this).val();
        $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", {
            tags: "value",
            tagmode: "any",
            format: "json"
        }, function(data) {
            $.each(data.items, function(i, item) {
                $("<img/>").attr("src", item.media.m).appendTo("#images");
                if (i == 20) return false;
            });
        });
    });
});

HERE is a working example: http://jsfiddle.net/MarkSchultheiss/NFRsX/

回复收藏 0 原文

感情废物 2025-01-10 05:10:05

删除值周围的双引号；
使标签：“值”为标签：值

还要检查括号错误。您的代码将运行得很好..我让它工作了..

回复收藏 0 原文

幼儿园老大 2025-01-10 05:10:05

我整理了一些您的代码，并且可以使以下内容正常工作：

$(function() {

  var url = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
      timer;

  var handle = function(data) {
                $.each(data.items, function(i,item){
                    $("<img/>").attr("src", item.media.m).appendTo("#images");
                    if ( i == 20 ) return false;
                });
              };

  var params = { tagmode: "any",
                 format: "json" };


  $("#test").keyup(function(){
    params['tags'] = $(this).val();
    window.clearTimeout(timer);
    timer = window.setTimeout(function(){        
      $.getJSON(url, params, handle);
    }, 500);
  });
});

我将 $.getJson 作为回调传递给 setTimeout，因此您不会在每次击键时都点击 flickr。

I tidied up a little your code and can get the following to work:

$(function() {

  var url = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
      timer;

  var handle = function(data) {
                $.each(data.items, function(i,item){
                    $("<img/>").attr("src", item.media.m).appendTo("#images");
                    if ( i == 20 ) return false;
                });
              };

  var params = { tagmode: "any",
                 format: "json" };


  $("#test").keyup(function(){
    params['tags'] = $(this).val();
    window.clearTimeout(timer);
    timer = window.setTimeout(function(){        
      $.getJSON(url, params, handle);
    }, 500);
  });
});

I passed $.getJson as a callback to setTimeout, so you're not hitting flickr on every keystroke.

回复收藏 0 原文