<video> 요소가 현재 재생 중인지 어떻게 알 수 있습니까?

Question 1

나는 것을 볼 수 MediaElement에의 인터페이스를 노출하는 같은 속성 paused, seeking그리고 ended. 그러나 목록에서 누락되었습니다 playing.

요소 가 재생 되기 시작할 때 발생하는 이벤트가 있고 재생 중 주기적으로 이벤트 가 playing발생 한다는 것을 알고 있지만 비디오가 지금 재생 중인지 여부를 확인하는 방법을 찾고 있습니다 . 이것을 결정하는 쉬운 방법이 있습니까?timeupdate

내가 가진 가장 가까운 것은 :

!(video.paused || video.ended || video.seeking || video.readyState < video.HAVE_FUTURE_DATA)

Question 2

오랜 시간 이었지만 여기에 좋은 팁이 있습니다. .playing모든 미디어 요소에 대한 사용자 지정 속성으로 정의 하고 필요할 때 액세스 할 수 있습니다. 방법은 다음과 같습니다.

Object.defineProperty(HTMLMediaElement.prototype, 'playing', {
    get: function(){
        return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);
    }
})

지금 당신은 그것을 사용할 수 있습니다 <video>또는 <audio>같은 요소 :

if(document.querySelector('video').playing){ // checks if element is playing right now
    // Do anything you want to
}

Question 3

이 (가 MediaElement) 현재 재생 중인지 여부를 나타내는 특정 속성은 없습니다 . 그러나 다른 속성의 상태에서이를 추론 할 수 있습니다. 만약:

currentTime 0보다 크고
paused 거짓이고
ended 거짓이다

요소가 현재 재생 중입니다.

또한 readyState오류로 인해 미디어가 중지 되었는지 확인해야 할 수도 있습니다. 아마도 다음과 같습니다.

const isVideoPlaying = video => !!(video.currentTime > 0 && !video.paused && !video.ended && video.readyState > 2);

Question 4

var video = $('selector').children('video');

var videoElement = video.get(0);

if (!videoElement.paused) {}

Jquery를 사용하는 한 가지 방법

Question 5

여기에서 내 응답을 참조하십시오 : HTML5 비디오 태그, 재생 상태를 감지하는 자바 스크립트?

기본적으로 이전에 언급했듯이 확인할 단일 속성은 없지만 사양에 따라 조건의 조합입니다.

Question 6

나는 같은 문제에 직면했다. 솔루션은 매우 간단하고 간단합니다.

// if video status is changed to "ended", then change control button to "Play Again"
video.onended = function() {
    $("#play_control_button").text("Play Again");
};

// if video status is changed to "paused", then change control button to "Continue Play"
video.onpause = function() {
    $("#play_control_button").text("Continue Play");
};

// if video status is changed to "playing", then change control button to "Stop"
video.onplaying = function() {
    $("#play_control_button").text("Stop");
};