Question

我对HTML比较陌生，所以请耐心等待。我正在尝试添加一个简单的javascript函数，该函数已经提供给我，将Flickr中的图像抓取到一个按钮。当我点击按钮时，没有任何反应。我不确定错误发生在哪里，但我认为它与未正确执行的功能有关。

HTML：

   <!DOCTYPE html>
    <html>
    <head>
        <title>getJSON</title>
        <meta charset="utf-8" />
        <script src="jquery-3.1.1.min.js"></script>
    </head>
    <body>
    <button onclick="myFunction()">Click me</button>
    <script>
    function myFunction() 
    {  //Functions don't need names. This function will simply run when the page loads
      var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
      $.getJSON( flickerAPI, 
      {  // The "$" simply refers to jQuery. This calls the getJSON function that is found inside jquery-3.1.1.min.js
        tags: "Baruch College", //Some filter information in the format set by Flickr, who owns the JSON
        tagmode: "any",
        format: "json"
      })
        .done(function( data ) 
        { //Here, a an unnamed function is created made into the event handler for the "done" event... in other words, this is the code that will manifest itself when the getJSON is done.
          $.each( data.items, function( i, item ) 
          {
            $( "<img>" ).attr( "src", item.media.m ).appendTo( "#images" );
            if ( i === 5 ) 
            {
              return false;
            }
          });
        });
    }
    </script>

    </body>
</html>

我上传了HTML中提到的jquery脚本：http://pastebin.com/2CfRNkvq

Answer 1

您需要指定图片在检索后的放置位置。在JavaScript代码中，您可以看到每个图片都会创建一个end标记，并将其附加到<img>的元素。

只需将id="images"添加到按钮元素，如下所示：

id="images"

单击按钮时，图像将放在按钮内。

尝试将javascript函数添加到按钮

1 个答案: