Questo metodo funziona:
audio.pause();
audio.currentTime = 0;
Ma se non vuoi scrivere queste due righe di codice ogni volta che interrompi un audio, potresti fare una delle due cose. Il secondo credo sia il più appropriato e non sono sicuro del motivo per cui gli "dei degli standard javascript" non hanno creato questo standard.
Primo metodo: creare una funzione e passare l'audio
function stopAudio(audio) {
audio.pause();
audio.currentTime = 0;
}
//then using it:
stopAudio(audio);
Secondo metodo (preferito): estendi la classe Audio:
Audio.prototype.stop = function() {
this.pause();
this.currentTime = 0;
};
Ho questo in un file javascript che ho chiamato "AudioPlus.js" che includo nel mio html prima di qualsiasi script che si occuperà di audio.
Quindi è possibile chiamare la funzione di arresto su oggetti audio:
audio.stop();
FINALMENTE CROMATO CON "canplaythrough":
Non l'ho provato in tutti i browser, ma questo è un problema che ho riscontrato in Chrome. Se si tenta di impostare currentTime su un audio a cui è associato un listener di eventi "canplaythrough", si attiverà nuovamente quell'evento che può portare a risultati indesiderati.
Quindi, la soluzione, simile a tutti i casi in cui è stato collegato un listener di eventi che si desidera veramente assicurarsi che non venga nuovamente attivato, è rimuovere il listener di eventi dopo la prima chiamata. Qualcosa come questo:
//note using jquery to attach the event. You can use plain javascript as well of course.
$(audio).on("canplaythrough", function() {
$(this).off("canplaythrough");
// rest of the code ...
});
BONUS:
Nota che puoi aggiungere ancora più metodi personalizzati alla classe Audio (o qualsiasi classe javascript nativa per quella materia).
Ad esempio, se si desidera un metodo di "riavvio" che riavvii l'audio, potrebbe essere simile a:
Audio.prototype.restart= function() {
this.pause();
this.currentTime = 0;
this.play();
};