Только 1 jPlayer играет, но он играет все

Question

Я создаю страницу отзывов и имею многочисленные примеры jPlayer loading.

инициализирует игрок с помощью этой функции:

initializePlayer: function (playerId,audio) { 

    $("#" + playerId).jPlayer({ 
     ready: function() { 
      $(this).jPlayer("setMedia", { 
       mp3: audio 
      }); 
     }, 
     play: function() { 
      $(this).jPlayer("pauseOthers"); 
     }, 
     swfPath: "/assets/scripts", 
     supplied: "mp3" 
    }); 
}, 

HTML, за оказанные игрок выглядеть следующим образом:

<div id="jquery_jplayer_1" class="jp-jplayer" style="width: 0px; height: 0px;"> 
    <img id="jp_poster_1" style="width: 0px; height: 0px; display: none;"> 
    <audio id="jp_audio_1" preload="metadata" src="/assets/images/testimonials/Melva"></audio> 
</div> 
<div id="jp_container_1" class="jp-audio span3">...</div> 

ПРИМЕЧАНИЯ: Я не показывать содержимое jp_container_1, потому что это стандартный jplayer. Я не настроил его вообще.

Единственное различие между каждым игроком является INT в идентификаторах и ЦСИ:

<div id="jquery_jplayer_2" class="jp-jplayer" style="width: 0px; height: 0px;"> 
    <img id="jp_poster_2" style="width: 0px; height: 0px; display: none;"> 
    <audio id="jp_audio_2" preload="metadata" src="/assets/images/testimonials/Mark.mp3"></audio> 
</div> 
<div id="jp_container_2" class="jp-audio span3">...</div> 

Если я включаю play части инициализатора, ни один из них играть. Если я его исключил, все они играют на втором игроке jquery_jplayer_1, а не на любом другом.

Что мне не хватает? Почему все связано с игроком 1?

Answer 1

похоже, что вы не установили значение cssSelectorAncestor. Если вы читали документацию здесь:

http://jplayer.org/latest/developer-guide/#jPlayer-option-cssSelectorAncestor

Вы увидите, что по умолчанию jp_container_1, что могло бы объяснить, почему они все играют на одном проигрывателе. Я считаю, что настройка этого значения для каждого игрока заставит его работать, как вы ожидаете.

Answer 2

сначала установите cssSelectorAncestor: «# jp_container_1» для всех игрока, как 1,2,3, то в нижней части функциональности jplayer

$("#jplayer_inspector_1").jPlayerInspector({jPlayer:$("#jquery_jplayer_1")}); 
$("#jplayer_inspector_2").jPlayerInspector({jPlayer:$("#jquery_jplayer_2")}); 

дать как это для всех игроков