[JS + HTML 5 + Firefox] balise <audio>
Bonsoir,
j'essaie de créer un petit player audio qui diffuserait une playlist chargée en AJAX.
Ma page marche bien sur google chrome, mais quand j'essaie sur firefox, le player disparait au chargement de la première chanson mais continue de diffuser la musique, et à la fin de la chanson au lieu de passer à la suivante, j'ai le droit à l'erreur "next is not a function"...
Bref, je sais pas si il y a un problème avec mon code javascript ou si firefox n'est pas trop au point avec la balise <audio>, mais si quelqu'un a une solution au problème, il est la bienvenue ^^.
Mon code :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
| <html>
<head>
<title>Zik player</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="jquery/jquery-1.4.2.js"></script>
<script type="text/javascript" src="jquery/jquery.ui.core.js"></script>
<script type="text/javascript" src="jquery/jquery.ui.widget.js"></script>
<script type="text/javascript" src="jquery/jquery.ui.position.js"></script>
<script type="text/javascript" src="jquery/jquery.ui.autocomplete.js"></script>
<link type="text/css" href="style.css" rel="stylesheet" />
<link rel="shortcut icon" href="img/icone.ico">
<script type='text/javascript'>
function next()
{
changeTitre(playlist[n]);
player.attr("src", playlist[n]);
player.load();
n++;
}
function changeTitre(url)
{
var track = url.split('/');
document.title = track[track.length-2]+" : "+track[track.length-1].split(".ogg")[0];
}
</script>
</head>
<body>
<audio id="player" src="" autobuffer controls autoplay onended="next();">Your browser does not support the audio element.</audio>
<script type='text/javascript'>
//chargement de la playlist du lecteur
var playlist = new Array();
var player = $("#player");
var n = 0;
$.ajax(
{
url: "playlist.php",
dataType: "xml",
success: function(xmlResponse)
{
var items = xmlResponse.getElementsByTagName("item");
var i;
for(i=0; i<items.length; i++)
{
playlist.push(items.item(i).firstChild.nodeValue);
if(i==0)
{
var track = playlist[0].split("/");
document.title = track[track.length-2]+" : "+track[track.length-1].split(".ogg")[0];
player.attr("src", playlist[0]);
player.load();
n++;
}
}
}
});
</script>
</body>
</html> |
