J'ai beaucoup J'ai trouvé un code JQuery d'une autre question à Faites cela mais qui utilise une image comme des contrôles de lecture / pause. J'utilise l'attribut Inbuilt Voici mon code HTML P> audio code> sur une seule page et je veux jouer un seul élément à la fois. C'est-à-dire que si un
audio code> est en cours de lecture et je clique sur la lecture sur un autre élément, l'élément précédent
audio code> doit faire une pause.
Controls = 'Commandes' Code> pour l'élément code> audio code> à la place. Est-il possible d'utiliser jQuery pour contrôler la fonction de lecture / pause pour l'élément code> audio de code> dans mon cas? P>
$(document).ready(function() {
var curPlaying;
$(function() {
$(".playback").click(function(e) {
e.preventDefault();
var song = $(this).next('audio')[0];
if(song.paused){
song.play();
if(curPlaying) $("audio", "#"+curPlaying)[0].pause();
} else { song.pause(); }
curPlaying = $(this).parent()[0].id;
});
});
});
6 Réponses :
En supposant que votre syntaxe pour arrêter et mettre en pause des pistes est correcte (je ne sais rien sur l'élément code> audio code>), vous devriez être capable de faire quelque chose comme ceci:
$(".playback").click(function(e) { // pause all other tracks $('.audio').each(function () { var song = this; if (!song.paused) { song.pause(); } }); // play the audio associated with this element this.play(); });
$(function(){ $("audio").on("play", function() { $("audio").not(this).each(function(index, audio) { audio.pause(); }); }); }); See sample at JSFiddle
Dans mon cas, l'exemple de Jsfiddle n'a travaillé qu'une seule fois: # 1 (OK) -> # 2 (OK, arrête # 1) -> # 1 (ne joue pas, ne peut pas arrêter # 2).
Voici une solution qui ne nécessite pas de jQuery. p> Certaines choses à noter: p>
Peu de modification à la réponse de LostComputer
dans votre code HTML écrit: p> dans js écrit: p> function pauseOthers(ele) {
$("audio").not(ele).each(function (index, audio) {
audio.pause();
});
}
Pour une raison quelconque, la réponse @LostComputer ne fonctionne pas pour moi, l'événement de jeu n'a jamais tiré, alors travaillez de cette manière.
<script> function controlplay(e) { document.querySelectorAll('.playback').forEach(item => { if(item.id != e.target.id) item.pause(); }); } </script> <script> document.querySelectorAll('.').forEach(item => { item.addEventListener("play", event => { controlplay(event) })}); </script>
angulaire: } p> p>
Les utilisateurs peuvent-ils jouer n'importe quel élément audio de la page au hasard? Si oui, ce que seul l'audio précédent ne fonctionnera pas.
Oui, les utilisateurs peuvent jouer n'importe quel élément au hasard.
Ici, tu vas github.com/rhroyston/mdl-audio