読者です 読者をやめる 読者になる 読者になる
記事一覧      日常       音楽       考え       ドラマ       映画       CM       Web

【Web】iTunes音楽紹介でアルバム全曲を紹介したいときには(機能改善しました)

Web 音楽 はてな javascript jQuery つくった


上記エントリのVerでは、1ページ内に検索結果を複数個表示できるようにはしておらず、
まあ気が向いたらやります。とか言っていたのですが、
「1ページ内に複数個貼れれば本命になりますよ!」とのコメントをいただいたので、実装してみましたヽ(´ー`)ノ*1

【スポンサードリンク】


≪クラムボン アルバム「triology」≫


≪クラムボン アルバム「2010」≫


こんなかんじで、なんこでもいけるよ!!*2
クラムボンの新アルバムも発売中です、ぜひ。

triology(初回限定盤)

triology(初回限定盤)


《使い方》
以下のjsをエントリ内にコピペして読み込ませる。

<script type="text/javascript" src="https://dl.dropboxusercontent.com/s/5i3r1lami9z7d0t/iTunespreviewForMulti.js"></script>


ここからは、1ページ内に2つ表示させる場合を想定して書きます。
その下に、キーワードと取得件数を指定するjsをコピペ。

<script>
// ★検索キーワード&取得件数
search({
  term: 'クラムボン triology',
  limit: 30
},1);
search({
  term: 'クラムボン 2010',
  limit: 30
},2);
</script>

term(検索キーワード)とlimit(取得件数)のあとに、番号を振る必要があります。
被ったらだめです。

そのあとは、曲を表示させたい位置に以下のhtmlをコピペ。

<div id ="displayArea1" >
</div>
<div>
<p id = "error1" style="color:#ff6699;"></p>
<input type="button" id="prevSong1" class="css_btn_class" style="color:#8dafb8; display:none;" onclick="prevSong(1)" value="&#60;&#60; 前の曲" />
<input type="button" id="nextSong1" class="css_btn_class" style="color:#8dafb8; display:none;" onclick="nextSong(1)" value="次の曲 &#62;&#62;" />
</div><br />

<div id ="displayArea2" >
</div>
<div>
<p id = "error2" style="color:#ff6699;"></p>
<input type="button" id="prevSong2" class="css_btn_class" style="color:#8dafb8; display:none;" onclick="prevSong(2)" value="&#60;&#60; 前の曲" />
<input type="button" id="nextSong2" class="css_btn_class" style="color:#8dafb8; display:none;" onclick="nextSong(2)" value="次の曲 &#62;&#62;" />
</div><br />

ここも「displayArea」、「error」、「prevSong」、「nextSong」に番号を振る必要があります。
先ほど設定した番号と紐付くので、同じ番号を設定して下さい。
それ以外の設定(jQueryとか)については、前回と変更なしです。
設定できてない場合は冒頭のエントリを参照して設定してみて下さい。

id:cliphitさん、コメントありがとうございました!!
おしまいヽ(´ー`)ノ

*1:実装に1時間もかからなかったので、最初からやっておけば…感ありました

*2:前のVerとはjs分けたので、特に変えることなくそのまま使えます