Этот метод работает:
audio.pause();
audio.currentTime = 0;
Но если вы не хотите писать эти две строки кода каждый раз, когда останавливаете звук, вы можете сделать одну из двух вещей. Второе, я думаю, является более подходящим, и я не уверен, почему «боги стандартов javascript» не сделали этот стандарт.
Первый способ: создать функцию и передать аудио
function stopAudio(audio) {
audio.pause();
audio.currentTime = 0;
}
//then using it:
stopAudio(audio);
Второй метод (предпочтительный): расширить класс Audio:
Audio.prototype.stop = function() {
this.pause();
this.currentTime = 0;
};
У меня есть это в файле JavaScript, который я назвал «AudioPlus.js», который я включаю в свой HTML-код перед любым сценарием, который будет иметь дело с аудио.
Затем вы можете вызвать функцию остановки на аудиообъектах:
audio.stop();
ЗАКЛЮЧИТЕЛЬНО ВЫПУСК ХРОМА С «canplaythrough»:
Я не проверял это во всех браузерах, но это проблема, с которой я столкнулся в Chrome. Если вы попытаетесь установить currentTime для аудио, к которому подключен прослушиватель событий canplaythrough, то вы снова вызовете это событие, что может привести к нежелательным результатам.
Таким образом, решение, аналогичное всем случаям, когда вы подключили прослушиватель событий, который вы действительно хотите удостовериться, что он больше не запускается, состоит в том, чтобы удалить прослушиватель событий после первого вызова. Что-то вроде этого:
//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 ...
});
БОНУС:
Обратите внимание, что вы можете добавить еще больше пользовательских методов в класс Audio (или любой собственный класс javascript в этом отношении).
Например, если вам нужен метод «рестарт», который перезапускает аудио, он может выглядеть примерно так:
Audio.prototype.restart= function() {
this.pause();
this.currentTime = 0;
this.play();
};