Làm cách nào để biết phần tử <video> hiện có đang phát không?

Question

Tôi thấy rằng giao diện MediaElement hiển thị các thuộc tính như paused, seeking và ended. Tuy nhiên, danh sách bị thiếu trong danh sách là playing.

Tôi biết có playing events lửa khi một phần tử bắt đầu chơi, và timeupdate events sự kiện định kỳ trong khi chơi, nhưng tôi đang tìm kiếm một cách để xác định xem một video đang phát ngay bây giờ. Có cách nào dễ dàng để xác định điều này không?

Gần nhất tôi nhận được là:

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

Answer 1

Không có một thuộc tính cụ thể mà sẽ tiết lộ cho dù một MediaElement hiện đang chơi. Tuy nhiên, bạn có thể suy ra điều này từ trạng thái của các thuộc tính khác. Nếu:

• currentTime là lớn hơn không, và
• paused là sai, và
• ended là sai

sau đó yếu tố hiện đang chơi.

Bạn cũng có thể cần phải kiểm tra readyState để xem liệu phương tiện có dừng do lỗi không.

Answer 2

Xem phản ứng của tôi ở đây: HTML5 video tag, javascript to detect playing status?

về cơ bản, như đã nói trước không có tài sản duy nhất để kiểm tra nhưng theo spec đó là một sự kết hợp của điều kiện.

Answer 3

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

var videoElement = video.get(0); 

if (!videoElement.paused) {} 

Một cách để làm việc đó bằng Jquery

Answer 4

Nó đã được một thời gian dài nhưng đây là một mẹo tuyệt vời. Bạn có thể xác định .playing làm thuộc tính tùy chỉnh cho tất cả các phần tử phương tiện và truy cập nó khi cần. Sau đây là cách:

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

Bây giờ bạn có thể sử dụng nó trên <video> hoặc <audio> yếu tố như thế này:

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