Question

所以我制作了一个小脚本，使用Flickr API在网站上搜索标签，它将返回包含该标签的图像，一切正常。

我的问题是当我试图获取图像的URL时，不知道我会怎么做，因为我看到了一些不同的方法，但没有一个真的帮助过我，基本上我想点击保存图像按钮和它将打印显示的当前图像的URL。

HTML：

                <title>get image</title>
<body>
    <form>
    <input type="text" id="search" placeholder="Enter Tag ... E.g. Cars">

    <script src="http://code.jquery.com/jquery-latest.js"></script>

    <input type="button" id="button" value="Search For Image">
    <input type="button" id="sbutton" value="Save Image">
    </form>
    <br>

CSS

img{height:auto; float: left;}

的Javascript

$(document).ready(function () {
            $("#button").click(function () {
                $("#images").empty();


                var search1 = document.getElementById("search").value;

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

                    });


                });

            });
        });

感谢阅读！任何帮助表示赞赏！

Answer 1

如果我理解正确的话。

＆＃13;

$(document).ready(function() {
  $("#button").click(function() {
    $("#images").empty();


    var search1 = document.getElementById("search").value;

    $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", {
      tags: search1,
      tagmode: "any",
      format: "json"
    }, function(data) {
      $.each(data.items, function(i, item) {
        $('<img/>').attr("src", item.media.m).appendTo('#images');
        $("#sbutton").prop('disabled', false);
        if (i === 0)
          return false;

      });


    });

  });

  $("#sbutton").click(function() {
    var iImage = $("#images img");
    $("#images p").empty();
    iImage.after("<p>" + iImage.attr("src") + "</p>");
  });
});

＆＃13;

img {
  height: auto;
  float: left;
}

＆＃13;

<title>get image</title>

<body>
  <form>
    <input type="text" id="search" placeholder="Enter Tag ... E.g. Cars">

    <script src="http://code.jquery.com/jquery-latest.js"></script>

    <input type="button" id="button" value="Search For Image">
    <input type="button" id="sbutton" value="Save Image" disabled>
  </form>
  <br>
  <div id="images"></div>

＆＃13;

Answer 2

要返回图像src，请使用

$("img").attr("src");

检查您的代码：http://jsfiddle.net/mzvaan/axw5mteh/

使用javascript从图像中提取URL

2 个答案: