var api_endpoint = 'http://dev.koekatamarin.com/zokei/itunes/'; var keyword = ''; var index; $(function(){ $('button').live('click',function(){ index = 0; // 画像のインデックスを初期化 $('div#main').empty(); // HTMLを初期化 _keyword = $(this).parent().children('input').val(); // フォームからキーワード取得 startSearch(_keyword); // キーワードでAJAX開始 }); // フォームのキーワードでiTunesAPiと通信する function startSearch(p_keyword) { $.ajax({ type: 'get', url: api_endpoint, data: { term: p_keyword, // startSearch関数の引数として渡されたフォームのキーワード entity: 'album', country: 'JP', limit: 200, }, success: function(json){ parseResult(json); }, error: function() { alert('ERROR'); } }); } function parseResult(json) { $.each(json.results, function(i) { $('div#main').append( ''+ ''+this.collectionName+''+ '' ); }); // ここからキレイなアニメーション表示のためのコード $('div#main img').hide(); animateImg(); function animateImg() { $('div#main img#album_'+index).fadeIn(); index++; setTimeout(function () { animateImg(); }, 30); } // ここまで } });