2017-08-11 2 views
1

自分のコードは、コンソールに表示されているにもかかわらず、ウェブページ上にロゴ、表示名、ステータスを表示しません。問題を特定するのを手伝ってください。私は大いに感謝します!ありがとうございました!ここでTwit Streamers freecodecampプロジェクト - DISPLAY ISSUE

は私のペンです: https://codepen.io/cmtran/pen/vJGRWJ?editors=1111 `

$(document).ready(function(){ 
    var user_arr = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"]; 
    var channelURL = 'https://wind-bow.gomix.me/twitch-api/channels/'; 
    var streamURL ='https://wind-bow.gomix.me/twitch-api/streams/'; 
var status; 
    var display_name; 
    var logoURL; 

    for (var i = 0; i < user_arr.length; i++) { 
    (function(i) { // protects i in an immediately called function 
     $.getJSON(streamURL + user_arr[i] + '?callback=?', function (data) { 
     //console.log(data); 
     if(data.stream === null){ 
      $.getJSON(channelURL + user_arr[i] + '?callback=?',function(data){ 
      var display_name = data.display_name; 
      var logoURL = data.logo; 
      status = "Offline"; 
      }) 
     } 
     else{ 
      display_name = data.stream.channel.display_name; 
     // console.log(display_name); 
     logoURL = data.stream.channel.logo; 
      status = "Online"; 
    } 
    $("#user_info").prepend("<div class= 'row'>" + "<div class='col-md-4'>" + "<img src= '" + logoURL + "'>" + "</div>" 
+ "<div class= 'col-md-4'>" + display_name + "</div>" + "<div class = 'col-md-4'>" + status + "</div></div>");  


     }); 
    })(i); 
} 







    }) 

答えて

0

$(".user_info")$("#user_info")を交換し、それが動作します。 codepenのHTMLでは、.user_infoはクラスであり、idではありません。 =)

+0

これは素晴らしいことです。 Astro Boogieありがとう!今は表示できますが、別のグリッドが見つかりました。ユーザー名がすべて表示されず、一部が繰り返し表示されるため、誤った箇所を混乱させています。あなたが私のためにそれを指摘できるなら、私はそれを感謝します! – ChuChu