J'aimerais que le bouton pause reprenne la chanson à partir de l'endroit où elle a été interrompue au lieu de redémarrer la chanson.

avec vanilla javascript uniquement s'il vous plaît, merci!

var songs = [
  "song1.mp3",
  "song2.mp3",
  "song3.mp3",
];

var song = new Audio();
var currentSong = 0;

var playButton = document.querySelector(".play");
var pauseButton = document.querySelector(".pause");

function playSong() {
  song.src = songs[currentSong];
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
  song.play();
}

playButton.addEventListener("click", function playSong() {
  song.src = songs[currentSong];
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
  song.play();
});

pauseButton.addEventListener("click", function pauseSong() {
  song.pause();
  pauseButton.style.display = "none";
  playButton.style.display = "block";
});
javascript audio
0
caíd 3 nov. 2019 à 16:09

1 réponse

Le morceau est réinitialisé car chaque fois que vous cliquez sur le bouton play, le src du morceau est à nouveau attribué. Et donc la chanson recommencera depuis le début.

Vous devrez donc modifier la partie de votre code où la chanson est sélectionnée. Faites-le en dehors de la fonction play de sorte que le fait de cliquer sur lecture ne joue que, et que cliquer sur pause ne fasse que suspendre.

function chooseSong() {
  song.src = songs[currentSong];
  songTitle.textContent = sT[currentSong];
  Artist.textContent = artistNames[currentSong];
  songCover.src = songCovers[currentSong];
}

function playSong() {
  pauseButton.style.display = "block";
  playButton.style.display = "none";
  song.play();
}

function pauseSong() {
  pauseButton.style.display = "none";
  playButton.style.display = "block";
  song.pause();
}

playButton.addEventListener('click', playSong);
pauseButton.addEventListener('click', pauseSong);

chooseSong();
0
Emiel Zuurbier 3 nov. 2019 à 14:26
58680453

Questions connexes

26 Comment vérifier si un élément est masqué dans jQuery?
29 Comment supprimer une propriété d'un objet JavaScript?
29 Comment inclure un fichier JavaScript dans un autre fichier JavaScript?
29 Comment puis-je supprimer un élément spécifique d'un tableau?
28 Comment renvoyer la réponse d'un appel asynchrone?

De nouvelles questions

2 Itération à travers l'objet de base de données Firebase et attribution de clés aux composants de réaction
2 Vous cherchez à exécuter une fonction après l'extraction dans ReachJS
2 Discrimination des prop typescript dans le composant fonctionnel de réaction
2 Rails - transmission de hachage de données de Ruby à JS via le fichier js.erb
2 Comment modifier les valeurs de clé d'un objet en LowerCase pour le tri
3 Soumettre par programme un ensemble de formulaires avec dangerouslySetInnerHTML
2 passer des valeurs de données de la fonction interne à la fonction interne avec js / jquery
3 javascript json trouve la valeur pour chaque chemin donné; gérer les erreurs
2 Déclencher une fonction dans un composant fonctionnel parent React à partir de son enfant
3 Comment changer le nom du mois anglais en arabe
Toutes les questions sur javascript >

javascript

Pour des questions concernant la programmation dans ECMAScript (JavaScript / JS) et ses divers dialectes / implémentations (hors ActionScript). Veuillez inclure toutes les balises pertinentes dans votre question; par exemple, [node.js], [jquery], [json], etc.

Plus à propos javascript...