HTML5 Аудиоплеер работает на сафари/Chrome, но не iPhone

У меня есть аудиоплеер HTML5, который работает на Safari на ПК, но, похоже, не работает на моем iPhone (4). Вот код:HTML5 Аудиоплеер работает на сафари/Chrome, но не iPhone

`  
function loadPlayer() { 
    var audioPlayer = new Audio(); 
    audioPlayer.controls="controls"; 
    audioPlayer.addEventListener('ended',nextSong,false); 
    audioPlayer.addEventListener('error',errorFallback,true); 
    document.getElementById("player").appendChild(audioPlayer); 
    nextSong(); 
} 
function nextSong() { 
    if(urls[next]!=undefined) { 
     var audioPlayer = document.getElementsByTagName('audio')[0]; 
     if(audioPlayer!=undefined) { 
      audioPlayer.src=urls[next]; 
      audioPlayer.load(); 
      audioPlayer.play(); 
      next++; 
     } else { 
      loadPlayer(); 
     } 
    } else { 
     alert('the end!'); 
    } 
} 
function errorFallback() { 
     nextSong(); 
} 
function playPause() { 
    var audioPlayer = document.getElementsByTagName('audio')[0]; 
    if(audioPlayer!=undefined) { 
     if (audioPlayer.paused) { 
      audioPlayer.play(); 
     } else { 
      audioPlayer.pause(); 
     } 
    } else { 
     loadPlayer(); 
    } 
} 

    function stop() { 
     var audioPlayer = document.getElementsByTagName('audio')[0]; 
     audioPlayer.pause(); 
     audioPlayer.currentTime = 0; 
    } 


function pickSong(num) { 
    next = num; 
    nextSong(); 
} 

var urls = new Array(); 
    urls[0] = '01_horses_mouth/mp3/01. Let The Dog See The Rabbit preface.mp3'; 
    urls[1] = '01_horses_mouth/mp3/02. The Other Horse\'s Tale.mp3'; 
    urls[2] = '01_horses_mouth/mp3/03. Caged Tango.mp3'; 
    urls[3] = '01_horses_mouth/mp3/04. Crumbs.mp3'; 
    urls[4] = '01_horses_mouth/mp3/05. Mood Elevator Reprise.mp3'; 
    urls[5] = '01_horses_mouth/mp3/06. Mood Elevator.mp3'; 
    urls[6] = '02_dub_project/mp3/01. Fearless Dub.mp3'; 
    urls[7] = '02_dub_project/mp3/02. Original Sound Dub.mp3'; 
    urls[8] = '02_dub_project/mp3/03. Rhok Shok Dub.mp3'; 
    urls[9] = '02_dub_project/mp3/04. Tron Dub.mp3'; 
    urls[10] = '02_dub_project/mp3/05. Eastern Fire Dub.mp3'; 
    urls[11] = '02_dub_project/mp3/06. Mary Jane Dub.mp3'; 

var next = 0; 
`

Может ли кто-нибудь увидеть что-нибудь очевидное, что бы это не сработало на iPhone?

Существует также код для элемента canvas, но я скрыл его на версии iPhone - холст в любом случае. Я прокомментировал код, но это, похоже, не имеет никакого значения, поэтому я предполагаю, что это не конфликт. Вот сайт:

http://lisadearaujo.com/clientaccess/wot-sound/indexiPad.html

источник

2012-05-21 yolise

Ах. Я понял это. На моих настольных версиях я скрыл плеер, так как я не использовал элемент игрока по умолчанию (мне просто нужны плейлисты и кнопки воспроизведения/паузы/остановки). Это отлично работало с игроком в скрытом div. На iPhone, однако, div должен отображаться. Мне нужно будет выяснить, как это сделать, или скрыть его каким-то другим способом, но, по крайней мере, он работает. – yolise

На моих версиях браузера, я скрытый аудио плеера по умолчанию, так что я мог бы использовать пользовательские элементы управления. Это отлично работало с игроком в скрытом div. На iPhone, однако, div должен отображаться для того, чтобы функционировать, даже с помощью пользовательских элементов управления (или так появляется).

Я спрятал div с низким индексом z, а не с дисплеем: none.

источник

2012-05-22 09:14:18 yolise

аудиоплеера HTML5 на iPhone требуется щелчок пользователя.

Работа при нажатии на проигрывателе:

<audio src="foo.ogg" width="200px" height="200px" />

источник

2012-05-21 19:16:25

HTML5 Аудиоплеер работает на сафари/Chrome, но не iPhone

ответ

Смежные вопросы