Skip to main content
se eliminaron 4 caracteres en el cuerpo
Origen Enlace

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3/"mp3","TEST DOS"],
["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3/"mp3","TEST TRES"],
["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3/"mp3","TEST CUATRO"],
["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3/"mp3","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3/","TEST DOS"],
["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3/","TEST TRES"],
["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3/","TEST CUATRO"],
["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3/","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3","TEST DOS"],
["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3","TEST TRES"],
["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3","TEST CUATRO"],
["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

se eliminaron 42 caracteres en el cuerpo
Origen Enlace

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
            ["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3"mp3/","TEST DOS"],
            ["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3"mp3/","TEST TRES"],
            ["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3"mp3/","TEST CUATRO"],
            ["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3"mp3/","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
            ["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3","TEST DOS"],
            ["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3","TEST TRES"],
            ["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3","TEST CUATRO"],
            ["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3/","TEST DOS"],
["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3/","TEST TRES"],
["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3/","TEST CUATRO"],
["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3/","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>

Origen Enlace

Lista de reproducción de audio no se recarga al finalizar

Estoy encontrándome el problema de que cuando termina el tema en reproducción de la lista, no se como puedo hacer para que recargue el siguiente tema (aleatorio) en el reproductor. Por lo general, cuando termina de reproducirse el tema entra siempre en bucle, solo logro que recargue mediante un document.location.reload(false); en esta parte:

cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    //cargarCancion(aleatorio());
    document.location.reload(false);

Agradezco cualquier ayuda ó idea. Muchas gracias!!!

<script>
var reproductor = document.getElementById("audio");
function cargarCancion(numero){
         
    // Carga la canción de forma dinámica
    var source= document.createElement('source');
    source.src=lista[numero][0];
    source.type="audio/mpeg";
     
    reproductor.appendChild(source);
    
    reproductor.load();
    reproductor.play();
    
    var titulo = document.getElementById("titulo");
    titulo.innerHTML = lista[numero][1];
    
}
function aleatorio() {
    return Math.round(Math.random()*(lista.length-1));
}
            // Inicio listado
var lista = [["http://www.sonidosmp3gratis.com/sounds/008576979_prev.mp3","TEST UNO"],
            ["http://www.sonidosmp3gratis.com/sounds/short-circuit.mp3","TEST DOS"],
            ["http://www.sonidosmp3gratis.com/sounds/whistle-campana-whatsapp.mp3","TEST TRES"],
            ["http://www.sonidosmp3gratis.com/sounds/mario-bros%20vida.mp3","TEST CUATRO"],
            ["http://www.sonidosmp3gratis.com/sounds/messenger-tono-mensaje-.mp3","TEST CINCO"]];
            // Fin listado

var listado = document.getElementById("listado");
for (x=0;x<lista.length;x++) {
    var item = document.createElement("li");
    item.innerHTML = lista[x][1];
    listado.appendChild(item);
}
cargarCancion(aleatorio());
reproductor.addEventListener("ended", function(){
    cargarCancion(aleatorio());
});
</script>
<audio id="audio"></audio>

<h3 id="sonando">Está sonando</h3>
<h1><div id="titulo"></div></h1>

<h2>Listado de temas:</h2>
<ul id="listado"></ul>