Ajax函数找不到正确的数据 - Ajax function is not finding the right data

我创建了一个AJAX函数，想知道为什么我的JS会出错。

$(document).ready(function() {
    $('#more').click(function() {
        var tag = $(this).data('tag'),
            maxid = $(this).data('maxid'),
            url = $(this).data('root'),
            id = $(this).data('id'),
            count = $(this).data('count');
        $.ajax({
            type: 'GET',
            url: '/ajax',
            data: {
                tag: tag,
                max_tag_id: maxid
            },
            dataType: 'json',
            cache: false,
            success: function(data) {
                // Output data
                $.each(data.images, function(i, src) {
                    $('section#images').append('<img src="' + data[src].images.standard_resolution.url + '">');
                });
                // Store new maxid
                $('#more').data('maxid', data.next_id);
            }
        });
    });
});

我创建了一个页面，该页面从instagram API获取数据，并将数据存储在数组中，因此当我单击更多时，它会将更多图像加载到容器div中。

编辑：

以下是php-ajax页面上的代码，它将数组编码为json输出：

  $instagram = new Instagram'Instagram;
  $instagram->setAccessToken($_SESSION['instagram_access_token']);
  $token = $_SESSION['instagram_access_token'];
    //$clientID = $_SESSION['client_id'];
  $current_user = $instagram->getCurrentUser();
  $tag = $instagram->getTag('folkclothing');
  $media = $tag->getMedia(isset($_GET['max_tag_id']) ? array( 'max_tag_id' => $_GET['max_tag_id'] ) : null);
  // Collect everything for json output
  $images = array();
  foreach ($media as $data) {
/*   $collection = array($data->images->standard_resolution->url,$data->link,$data->getId(),$data->likes->count); */
    /*
$images[] = $data->images->standard_resolution->url;
    $images[] = $data->link;
    $images[] = $data->getId();
    $images[] = $data->likes->count;
*/
    /*
$data_url[] = $data->images->standard_resolution->url;
    $data_link[] = $data->link;
    $data_id[] = $data->getId();
    $data_likes[] = $data->likes->count;
    $images[] = array($data_url);
*/
    $images[] = array($data->images->standard_resolution->url,$data->link,$data->getId(),$data->likes->count);
  }
  echo json_encode(array(
    'next_id' => $media->getNextMaxTagId(),
    'images'  => $images
  ));

上面的代码创建了一个数组，然后将其转换为json对象，但我不确定如何将其拆分为图像url、图像id、点赞和图像链接的嵌套数组。这有可能得到嵌套数组吗？

编辑结束

它确实起了作用，但我想在这个数组中找到特定的元素，所以我创建了上面的AJAX函数。

我得到的错误是：

未捕获的类型错误：无法读取未定义的属性"images"

任何帮助都会很棒。

尝试替换

            $.each(data.images, function(i, src) {
               $('section#images').append(
               '<img src="' + data[src].images.standard_resolution.url + '">'
              );
          });

带有

            $.each(data.images, function(i, src) {
               $('section#images').append(
               '<img src="' + src.standard_resolution.url + '">'
              );
          });

对于这个问题的答案，我最终正确地构建了我的数组，并使用json_encode把它全部正确列出，这样我就可以像这样提取正确的数据。

ajax.php：

  foreach ($media as $data) {
    $images[] = array(
        "data_url"=>$data->images->standard_resolution->url,
        "data_link"=>$data->link,
        "data_text"=>$data->getCaption(),
        "data_id"=>$data->getId(),
        "data_likes"=>$data->likes->count
    );
  }
  echo json_encode(array(
    'next_id' => $media->getNextMaxTagId(),
    'images'  => $images
  ));

这创建了正确的数据数组。

然后我纠正了js使其工作。

JS代码：

$(".loading").hide();
$(document).ready(function() {
      $('#more').click(function() {
        var tag   = $(this).data('tag'),
            maxid = $(this).data('maxid');
        $.ajax({
          type: 'GET',
          url: '/ajax',
          data: {
            tag: tag,
            max_tag_id: maxid
          },
          dataType: 'json',
          cache: false,
          success: function(data) {
            // Output data
            $.each(data.images, function(i, src) {
            var $content = $('<article class="instagram-image"><form class="forms" action="/image" method="post"><a class="fancybox" href="'+ data.images[i].data_link +'"><img alt="' + data.images[i].data_text + '" src="' + data.images[i].data_url + '" alt="' + data.images[i].data_text + '" /></a><button class="ajax instabtn like icon-heart" type="submit" name="action" value="Like"></button><input type="hidden" name="id" value="'+ data.images[i].data_id +'"><p>'+ data.images[i].data_likes +'</p></form></article>');
              $('section#images').append($content).fadeIn(1000);
              });
            // Store new maxid
            $('#more').data('maxid', data.next_id);
          }
        });
      });
    });

我希望这能帮助那些需要额外信息的人。

尝试这个

 ....
 success: function(data) {
        // Output data
        $.each(data.images, function(i, src) {
          $('section#images').append(
            '<img src="' + data[i].images.standard_resolution.url + '">'
                          //----^----here
          );
        });
        // Store new maxid
        $('#more').data('maxid', data.next_id);
      }

更改图像标签中的数据访问

来自

data[src].images.standard_resolution.url
     ^^^

至

data[i].images.standard_resolution.url
     ^

这里使用的是data.images的Array，所以应该使用data.images 的index

试试看，

if(data.images)// check if data.images found, otherwise it will give error
{
    $.each(data.images, function(i, src){
       $('section#images').append(
          '<img src="' + data.images[i].standard_resolution.url + '">'
                        // use i ----^----here
                        // or use src.standard_resolution.url directly
       );
    });
}