почему jPlayer не воспроизводит мои файлы MP3 в Firefox? - PullRequest
5 голосов
/ 28 декабря 2011

У меня проблемы с воспроизведением файла MP3 с использованием jQuery Jplayer в Firefox 8. Я установил последнюю версию флэш-памяти для своего браузера и вижу, что файл jplayer.swf загружается на вкладке Flash в Firebug.

Я включил следующие файлы в этом порядке:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script src="https://raw.github.com/happyworm/jPlayer/master/jquery.jplayer/jquery.jplayer.js" type="text/javascript" charset="utf-8"></script>

И у меня есть это в DOM, который загружает:

  $("#jquery_jplayer").jPlayer({
    ready: function () {
      $(this).jPlayer("setMedia", {
        mp3: "http://sound26.mp3pk.com/indian/ladiesvsricky/ladiesvsrickybahl01(www.songs.pk).mp3"

      });
    },
    swfPath: "http://cloudfactory-transcription.s3.amazonaws.com/javascripts/",
    supplied: "mp3",
    volume: 1,
    wmode:"window",
    solution: "html,flash"
  });

У меня есть этот HTML:

<div id="jquery_jplayer" style="height: 0px"></div>
          <div class="jp-audio">
            <div class="jp-type-single">
              <div id="jp_interface_1" class="jp-interface all_rounded_corners">
                <ul class="jp-controls">
                  <li><a href="#" class="jp-play pp" tabindex="1">play</a></li>
                  <li><a href="#" class="jp-pause pp" tabindex="1">pause</a></li>
                  <li><a href="#" class="jp-previous traverse" tabindex="1">Previous</a></li>
                </ul>
                <div class="jp-progress" style = "display:none;">
                  <div class="jp-seek-bar">
                    <div class="jp-play-bar"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>

А Firefox не может воспроизвести файл MP3. Я также вижу скрытый объект, который выглядит так:

<object width="1" height="1" id="jp_flash_0" data="http://cloudfactory-transcription.s3.amazonaws.com/javascripts/Jplayer.swf" type="application/x-shockwave-flash">  <param name="flashvars" value="jQuery=jQuery&amp;id=jquery_jplayer&amp;vol=1&amp;muted=false">
<param name="allowscriptaccess" value="always">
<param name="bgcolor" value="#000000">
<param name="wmode" value="window">
</object>

Ответы [ 2 ]

14 голосов
/ 29 декабря 2011

было несколько вещей:

  1. Если вы не укажете явный Предок контейнера jPlayer по умолчанию использует элемент DOM с идентификатором #jp_container_1, который вы не сделалиукажите в HTML
  2. Поскольку FF HTML 5 Audio не может воспроизводить MP3, для работы требуется последний jPlayer SWF, код конструктора jPlayer указывает на старую версию SWF.

Вот скрипка с исправлением: http://jsfiddle.net/75lb/gdLnT/

Исправленный HTML:

<div id="jquery_jplayer"></div>
<div id="jp_container_1" class="jp-audio">
    <div class="jp-type-single">
      <div id="jp_interface_1" class="jp-interface all_rounded_corners">
        <ul class="jp-controls">
          <li><a href="#" class="jp-play pp" tabindex="1">play</a></li>
          <li><a href="#" class="jp-pause pp" tabindex="1">pause</a></li>
          <li><a href="#" class="jp-previous traverse" tabindex="1">Previous</a></li>
        </ul>
        <div class="jp-progress" style = "display:none;">
          <div class="jp-seek-bar">
            <div class="jp-play-bar"></div>
          </div>
        </div>
      </div>
    </div>
</div>

Исправленный Javascript:

$("#jquery_jplayer").jPlayer({
    ready: function () {
      $(this).jPlayer("setMedia", { mp3: "http://sound26.mp3pk.com/indian/ladiesvsricky/ladiesvsrickybahl01(www.songs.pk).mp3" } );
    },
    //swfPath: "http://cloudfactory-transcription.s3.amazonaws.com/javascripts/",
    swfPath: "http://www.jplayer.org/latest/js/Jplayer.swf",
    supplied: "mp3",
    volume: 1,
    wmode:"window",
    solution: "html,flash",
});
2 голосов
/ 15 апреля 2014

У меня была та же проблема, я создал аудио-плейлист jplayer и загрузил в него mp3-файлы.

он работал на Chrome, а не на Firefox

Я исправил это, добавив решение: flash

    $(document).ready(function(){

    var myPlaylist = new jPlayerPlaylist({
    jPlayer: "#jquery_jplayer_1",
    cssSelectorAncestor: "#jp_container_1"
     }, [
    {
        title:"Cro Magnon Man",
        artist:"miaow",
        mp3:"http://www.jplayer.org/audio/mp3/TSP-01-Cro_magnon_man.mp3",
        oga:"http://www.jplayer.org/audio/ogg/TSP-01-Cro_magnon_man.ogg"
    }

    ], {
    playlistOptions: {
  enableRemoveControls: true
    },
      swfPath: "js",
    supplied: "mp3",
    wmode: "window",
    solution: "flash",
    });

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