Changer fichier audio sur le bouton cliquez

Je suis en train de modifier le fichier audio sur un bouton clic et je reçois l'erreurChanger fichier audio sur le bouton cliquez

Uncaught TypeError: audio.load is not a function

Mon code est ci-dessous, l'idée est d'appuyer sur le bouton et le fichier audio changera.

Sans la ligne audio.load(), le code sera exécuté et le src sera mis à jour, mais l'audio ne change pas. Qu'est-ce que je rate?

HTML:

<!DOCTYPE HTML> 
<html> 
<body> 
    <br> 
    <audio controls> 
    <source src = "audio_file_1.mp3" 
     id="audio" type="audio/mpeg"> 
    Your browser does not support the audio element! 
    </audio> 
    <br> 
    <button onClick="changeAudio();">Change</button> 
</body> 
<script src="temp.js"></script> 
</html>

Javascript:

// temp js 
var a = 1; 
function changeAudio() { 
    var audio = document.getElementById('audio'); 
    if (a==1) { 
    audio.src = 'audio_file_1.mp3'; 
    a = 2; 
    } 
    else { 
    audio.src = 'audio_file_2.mp3'; 
    a = 1; 
    } 
    audio.load(); 
} 

changeAudio();

(aussi, si quelqu'un sait par exemple des fichiers audio que je peux utiliser à la place du audio_file_1.mp3 et audio_file_2.mp3, je serais heureux de mettre à jour le code donc tout le monde peut l'exécuter plus facilement)

Modifier WRT Rob M's ans wer:

Pour toute personne ayant le même problème, la solution est de changer deux lignes:

D'abord, dans le code HTML, le <audio control> devrait se tourner vers <audio control id="audio_id">

En second lieu, dans le code javascript du audio.load() devrait se tourner vers document.getElementById('audio_id').load();

Source

2017-07-25 Eric HB

ne devriez-vous appel à '.load()' sur l'élément réel ''

oui, vous avez absolument raison, mon erreur, si vous voulez écrire une réponse je vais l'accepter –

il n'y a aucun événement .load() sur une étiquette <source>, il est sur l'étiquette <audio> - mettre à jour votre code pour appeler load() sur le parent <audio> tag et ça devrait marcher.

Source

2017-07-25 18:16:54

Eh bien, je pense que vous essayez d'accéder à l'élément <audio> par son attribut id, mais vous n'avez pas défini l'attribut id sur la balise audio. Il doit y avoir quelque chose comme ça

<audio id="audio" controls> 
    <source src = "audio_file_1.mp3" 
     id="track" type="audio/mpeg"> 
     Your browser does not support the audio element! 
</audio>

Et changer le fichier audio:

var a = 1; 
function changeAudio() { 
    var audio = document.getElementById('audio'); 
    if (a==1) { 
    document.getElementById('track') = 'audio_file_1.mp3'; 
    a = 2; 
    } 
    else { 
    document.getElementById('track') = 'audio_file_2.mp3'; 
    a = 1; 
    } 
    audio.load(); 
} 

changeAudio();

Source

2017-07-25 18:50:16 AngeLOL

la source a un ID dans mon code, défini comme 'id =" audio "' et, comme le souligne la réponse de Rob, vous devez utiliser la fonction '.load()' sur l'élément '

Changer fichier audio sur le bouton cliquez

Répondre

Questions connexes