在jQuery中獲取JSON onClick

<script> 
     var twitchApi = "https://api.twitch.tv/kraken/streams"; 
     $.getJSON(twitchApi, function (json) { 
     for (var i = 0; i < 9; i++) { 
     var streamGame = json.streams[i].game; 
     var streamThumb = json.streams[i].preview.medium; 
     var streamVideo = json.streams[i].channel.name; 
     <!-- var streamViewers = json.streams[i].streamViewers; --> 
     $('#twitch').append('<img style="width: 250px; height: 250px;" src="' + streamThumb + '"></img>'); 
    } 
}); 
</script>

所以我有這段代碼。我想讓它在點擊圖片或按鈕時獲取9個流預覽。我怎樣才能做到這一點？有人可以爲我修復代碼嗎？另外，如何編輯從JSON獲取的縮略圖？在jQuery中獲取JSON onClick

來源

2016-05-17 JohnDotHR

結合元件的像'$點擊事件（函數（）{$（ '＃yourbuttonid'）上單擊（函數（）{// 你的上面的代碼 }）; }）;' – Satpal

@Satpal像這樣？ http://pastebin.com/fw1pCzDM如果是的話，它不工作..我希望頁面打開後立即顯示9個縮略圖，然後如果你想要，你可以點擊按鈕加載9個。 – JohnDotHR

您可以獲取數據並保存在一個變量中，然後按需顯示。

$(function() { 
    //varianles 
    var i=0; 
    var twitchApi = "https://api.twitch.tv/kraken/streams"; 
    var twitchData; 
    //Get data from API and store it in variable 
    $.getJSON(twitchApi, function(json) { 
     twitchData = json.streams; 

     //Set upon page load 
     setData() 
    }); 

    function setData(){ 
     var j = twitchData.length > (i + 9) ? (i + 9) : twitchData.length; 
     for (; i < j; i++) { 
      var streamGame = twitchData[i].game; 
      var streamThumb = twitchData[i].preview.medium; 
      var streamVideo = twitchData[i].channel.name; 
      <!-- var streamViewers = twitchData[i].streamViewers; --> 
      $('#twitch').append('<img style="width: 250px; height: 250px;" src="' + streamThumb + '"></img>'); 
     } 
    }  

    //Bind click handlers 
    $('#button').click(function() { 
     setData(); 
    }); 
});

來源

2016-05-17 11:10:26 Satpal

在jQuery中獲取JSON onClick

回答

相關問題