0

Estoy intentando reproducir un audio en una pagina al hacer click en un boton pero que esta en otra pagina, es decir, hago click en el boton de la pagina1 y el audio se debe reproducir en la pagina2 en tiempo real.

Hacerlo en la misma pagina es sencillo, a continuación muestro código:

<html>
<head>
    <meta charset="UTF-8">
    <title>Prueba</title> 
    <link rel="stylesheet" type="text/css" href="css/css_prueba.css">
</head>

<body>

    <audio id="audio" controls>
        <source type="audio/mp3" src="audio.mp3"><br/><br/><br/><br/>
    </audio> 

    <input type="button" value="ALARMA" name="btn_alarma" id="BTN_ALARMA" onclick="alarma();"/>
</body>
</html>

<script>
var audio = document.getElementById("audio");

function alarma(){
    audio.play();
}
</script>       

Y el codigo CSS para que oculte los controles del audio:

#audio{
display: none
}

Para hacerlo de pagina1 a pagina2 intente importar el codigo js en ambas paginas poniendo la etiqueta <audio> solamente en la pagina2 y el botón "ALARMA" solo en la pagina1 pero no funciona, y la verdad no se como hacerlo.

¿Es posible hacer esto?, si alguien tiene un ejemplo o que me pueda orientar una forma de como hacerlo estaré muy agradecido...

1 respuesta 1

2

Logré que al hacer clic en el botón de tu código, se reproduzca automáticamente el audio en una nueva ventana:

#audio{
display: none
}
<body>

    <audio id="audio" controls>
        <source type="audio/mp3" src="#"><br/><br/><br/><br/>
    </audio> 

    <input type="button" value="ALARMA" name="btn_alarma" id="BTN_ALARMA" onclick="window.open('audio.mp3'); return false;"/> 
  
</body>
</html>

<script>
var audio = document.getElementById("audio");

function window.open(){
    audio.play();
}
</script>    


Como puedes notar cambié inicialmente el src por #, pues lo que se quiere es que se reproduzca en la nueva ventana. Luego con el evento onclick="window.open('audio.mp3'); return false;" lo que le digo al botón es que me abra en una nueva ventana el archivo o dirección "audio.mp3" y que se reproduzca automáticamente con la función audio.play();


PD:

Para hacer las pruebas reemplacé tu archivo "audio.mp3" por esta dirección a modo de ejemplo: http://www.evidenceaudio.com/wp-content/uploads/2014/10/lyricchords.mp3

Funcionó sin problemas

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.