MeireQubeとか複数のaudio.jsが置いてあるページは今まである曲を再生している途中に別の曲を再生してもさっきまで流れてた曲が流れたままになってた

「注意：止めてから次の曲！！（2曲目再生してもさっきまで流れてた曲は止まりません）」とか書いてた

audio.js部分のタグを見ると再生中のもの(divタグ)には「playing」クラスが追加されているので、別の曲の再生ボタンが押されたときにそのdiv.playing中のボタン(pタグでクラスはpauseのもplayのも反応するっぽい？)を押させる感じで（jQueryで）

$("p.play").on("click",function(){
 $("div.playing p.pause").trigger("click");
});

ちなみにdivを押させるのはできなかった

pタグがボタン全体にかかってなくてpの範囲外のとこで押すと機能しないので直でaudio.jsの制御をいじりたい
初期化したときの文にあるasにインスタンス（各プレイヤーの制御）が詰まってるらしいのでそれをいじる

$(function(){
//初期化
  var as; 　　 //functionの外でasを定義する
  audiojs.events.ready(function() {
    as = audiojs.createAll();
  });

//再生したら止めるやつ
  $(document).on("click", "div.play-pause" ,function(){
　　　　//(divタグは新しく生成されたものなのでこの形式で)
    var n = $(this).parent().attr("id").replace(/[^0-9]/g, "");
　　　　//audiojs_wrapper0のようにつけられたidから押したプレイヤーの番号を取得

    var playing = []; 　　 //現在再生中のプレイヤーno.を詰め込むやつ
    $("div.playing").each(function(index, elem){　　　　//再生中(playingクラスがつく)のプレイヤー
      playing.push(parseInt($(elem).attr("id").replace(/[^0-9]/g, "")));
        //同様にno.を取得してリストに入れる
    });
    for(var i = 0; i < playing.length; i++){
      p = playing[i];
      if(p != n){ 　　 //今押したプレイヤーも再生中ということになるので
        as[p].pause();
      }
    }
  });

});

←前へ一覧へ 次へ→