이 방법은 작동합니다 :
audio.pause();
audio.currentTime = 0;
그러나 오디오를 중지 할 때마다이 두 줄의 코드를 작성하지 않으려면 두 가지 중 하나를 수행하면됩니다. 내가 생각하는 두 번째가 더 적절한 것이라고 생각하는데 왜 "자바 스크립트 표준의 신들"이이 표준을 만들지 않았는지 모르겠습니다.
첫 번째 방법 : 함수 생성 및 오디오 전달
function stopAudio(audio) {
audio.pause();
audio.currentTime = 0;
}
//then using it:
stopAudio(audio);
두 번째 방법 (권장) : 오디오 클래스 확장 :
Audio.prototype.stop = function() {
this.pause();
this.currentTime = 0;
};
오디오를 처리 할 스크립트 전에 HTML에 포함하는 "AudioPlus.js"라는 자바 스크립트 파일에이 파일이 있습니다.
그런 다음 오디오 객체에서 중지 기능을 호출 할 수 있습니다.
audio.stop();
"canplaythrough"와 함께 마지막으로 크롬 문제 :
모든 브라우저에서 이것을 테스트하지는 않았지만 이것은 Chrome에서 발생한 문제입니다. "canthroughthrough"이벤트 리스너가 연결된 오디오에서 currentTime을 설정하려고하면 해당 이벤트가 다시 트리거되어 원하지 않는 결과가 발생할 수 있습니다.
따라서 다시 트리거되지 않도록하려면 이벤트 리스너를 연결했을 때의 모든 경우와 유사한 솔루션은 첫 번째 호출 후 이벤트 리스너를 제거하는 것입니다. 이 같은:
//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 클래스 (또는 그 문제에 대한 기본 자바 스크립트 클래스)에 훨씬 더 많은 사용자 정의 메소드를 추가 할 수 있습니다.
예를 들어 오디오를 다시 시작한 "다시 시작"방법을 원하면 다음과 같이 보일 수 있습니다.
Audio.prototype.restart= function() {
this.pause();
this.currentTime = 0;
this.play();
};