Question

我一直试图找出一种方法来列出特定列表中所有成员的个人资料图像。

我可以从API网址

获取状态

 $.ajax({
  url: "https://api.twitter.com/1/lists/statuses.json?slug=stringed-chaos&owner_screen_name=darkpsy",
  dataType: "jsonp",
  jsonpCallback: "listTweets"
});

function listTweets(r) { 
console.log(r);
var output = '<ul>';

$.each(r, function(key, val) {
    var text = r[key].text;
    var thumbnail = r[key].user.profile_image_url;
    var name = r[key].user.name;

    output += '<li>';
    output += '<img src="' + thumbnail +'" alt="Photo of ' + name + '">';
    output += '<div>' + text + '</div>';
    output += '</li>';      
}); //go through each tweet
output += '</ul>';

当我将API URL更改为GET列表/成员URL时（如official twitter doc here中所述）我无法提取任何信息（未定义）。我可以解析statuses.json就好了，但members.json什么都不返回

代码如下：

    $.ajax({
  url: "https://api.twitter.com/1/lists/members.json?slug=stringed-chaos&owner_screen_name=darkpsy",
  dataType: "jsonp",
  jsonpCallback: "listTweets"
});

function listTweets(r) { 
console.log(r);
var output = '<ul>';

    $.each(r, function(key, val) {
        var text = r[key].text;
        var thumbnail = r[key].profile_image_url;
        var name = r[key].screen_name;
            output += '<li>';
        output += '<img src="' + thumbnail +'" alt="Photo of ' + name + '">';
        output += '<div>' + text + '</div>';
        output += '</li>';      
    }); //go through each tweet
    output += '</ul>';
    $('#tweetlist').html(output);}`

感谢任何形式的帮助，因为twitter API文档似乎不太友好，我也没有在网上找到任何解决此问题的方法。

Answer 1

试试这个：

<!DOCTYPE HTML>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(function() {
  $.ajax({
    url: "https://api.twitter.com/1/lists/statuses.json?slug=customers&owner_screen_name=vijaysales",
    dataType: "jsonp",
    success: function(r) {
      listTweets(r);
    }
  });
  function listTweets(r) {
    var output = '<ul>';
    $.each(r, function(key, val) {
      var text = r[key].text;
      console.log(JSON.stringify(r[key]));
      var thumbnail = r[key].user.profile_image_url;
      var name = r[key].screen_name;
      output += '<li>';
      output += '<img src="' + thumbnail +'" alt="Photo of ' + name + '">';
      output += '<div>' + text + '</div>';
      output += '</li>';      
    }); //go through each tweet
    output += '</ul>';
    $('#tweetlist').html(output);
  }
})
</script>
</head>
<body>
<div id="tweetlist"></div>  
</body>
</html>

您可以使用success方法。我修复了关于profile_image_url的问题。

<强>更新

<!DOCTYPE HTML>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title></title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$(function() {
  $.ajax({
    url: "https://api.twitter.com/1/lists/members.json?slug=customers&owner_screen_name=vijaysales",
    dataType: "jsonp",
    success: function(r) {
      listTweets(r);
    }
  });
  function listTweets(r) {
    var output = '<ul>';
    $.each(r.users, function(n, user) {
      var text = user.status ? user.status.text : '';
      var thumbnail = user.profile_image_url;
      var name = user.screen_name;
      output += '<li>';
      output += '<img src="' + thumbnail +'" alt="Photo of ' + name + '">';
      output += '<div>' + text + '</div>';
      output += '</li>';      
    }); //go through each tweet
    output += '</ul>';
    $('#tweetlist').html(output);
  }
})
</script>
</head>
<body>
<div id="tweetlist"></div>  
</body>
</html>

Answer 2

Twitter的成员列表API以不同的格式从状态API返回数据。您要查找的数据包含在users[]下。这是一个固定的解决方案：

$.ajax({
    url: "https://api.twitter.com/1/lists/members.json?slug=customers&owner_screen_name=vijaysales",
    dataType: "jsonp",
    success : function(data) {listTweets(data["users"]);}
});

function listTweets(r) {
    var output = '<ul>';

    $.each(r, function(key, val) {
        var text = r[key].text;
        var thumbnail = r[key].profile_image_url;
        var name = r[key].screen_name;


        output += '<li>';
        output += '<img src="' + thumbnail +'" alt="Photo of ' + name + '">';
        output += '<div>Photo of ' + name + '</div>';
        output += '</li>';      
    }); //go through each tweet
    output += '</ul>';
    $('#tweetlist').html(output);
}

我将回调从jsonpCallback更改为success()，因为jsonpCallback似乎在jsFiddle的最新版jQuery上运行得不好。

在jsFiddle上尝试：http://jsfiddle.net/vCA4F/并查看jsonviewer上返回的JSON的结构。

如何使用他们的头像显示推特列表中的成员列表

2 个答案: