2012-04-26 1 views
0

Я действительно действительно пробовал часы, чтобы найти ответ сам, но я просто не знаю, как это решить. Я абсолютно не знаком с javascript.Добавить Eventlistener для управления HTML5-Audio

Моя задача: Я хочу управлять HTML5-Audio Element с помощью JavaScript. Мои первые шаги:

<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Test</title> 
<script type="text/javascript"> 
document.getElementById("myAudio").addEventListener('onpause', function(){ 
alert("Paused!"); 
getElementById("myAudio").play(); 
alert("Playing again!"); 

}, false); 

</script> 
</head> 

<body> 

<audio id="myAudio" controls autobuffer > 
<source src="Test.mp3" /> 

</audio> 
</body> 

К сожалению, это не сработает. Кажется, что нет события, называемого ...

Еще одна вещь, о которой я удивляюсь, заключается в том, что Chrome показывает аудиоконтроль. Но Firefox (FF 11) просто отображает пустую страницу.

Я просто не понимаю, я провел часы и пробовал много альтернатив ... Я очень надеюсь, что кто-то может мне помочь.

Большое спасибо!

ответ

0

Firefox не поддерживает формат MP3. Используйте другой формат аудиофайлов, например OGG.

Добавить новый источник бирку с другим форматом файл:

<audio id="myAudio" controls autobuffer > 
    <source src="Test.mp3" type="audio/mpeg" /> 
    <source src="Test.ogg" type="audio/ogg" /> 
</audio> 

https://developer.mozilla.org/En/Media_formats_supported_by_the_audio_and_video_elements#MPEG_H.264_%28AAC_or_MP3%29

Используйте один из доступных инструментов онлайн/оффлайн, чтобы преобразовать файл в формат OGG:

+0

спасибо! это объясняет, почему это не работает в firefox! Мое первоначальное намерение состояло в том, чтобы управлять HTML5-Audio Element с помощью JavaScript. К сожалению, это не работает с кодом, который я вставил выше. Кажется, что нет события, которое называется ... что я делаю неправильно? – HazelNut

+0

«пауза» - правильное название события, а не «onpause» http://dev.w3.org/html5/spec/media-elements.html#mediaevents – mems

+0

спасибо! Я смотрел здесь, к сожалению: http://www.w3schools.com/html5/html5_ref_eventattributes.asp – HazelNut