Thuộc tính readyState của đối tượng Video trong HTML DOM trả về một số tương ứng với trạng thái sẵn sàng hiện tại của video.
Cú pháp
Trả về giá trị số:
mediaObject.readyState
Ở đây, giá trị trả về có thể là:
- 0 (HAVE_NOTHING) – mô tả không có thông tin khả dụng
- 1 (HAVE_METADATA) – mô tả metadata cho media đã sẵn sàng và video có thể tìm kiếm
- 2 (HAVE_CURRENT_DATA) – mô tả dữ liệu cho vị trí phát hiện tại có sẵn, nhưng không đủ dữ liệu để phát khung hình tiếp theo
- 3 (HAVE_FUTURE_DATA) – mô tả dữ liệu cho vị trí hiện tại và cũng cho ít nhất hơn hai khung hình video
- 4 (HAVE_ENOUGH_DATA) – mô tả đủ dữ liệu có sẵn để bắt đầu phát
Ví dụ
Ví dụ minh họa thuộc tính HTML DOM Video readyState:
<!DOCTYPE html> <html> <head> <title>HTML DOM Video readyState</title> <style> * { padding: 2px; margin:5px; } form { width:70%; margin: 0 auto; text-align: center; } input[type="button"] { border-radius: 10px; } </style> </head> <body> <form> <fieldset> <legend>HTML-DOM-Video-readyState</legend> <video id="demo" width="320" controls><source src="" type="video/mp4"></video><br> <input type="button" onclick="setTrackDetails()" value="Đặt nguồn"> <input type="button" onclick="getTrackDetails()" value="Lấy trạng thái sẵn sàng"> <div id="divDisplay"> </div> </fieldset> </form> <script> var divDisplay = document.getElementById("divDisplay"); var demo = document.getElementById("demo"); var srcOfMedia = 'https://www.tutorialspoint.com/html5/foo.mp4'; function getTrackDetails() { divDisplay.textContent = 'Trạng thái sẵn sàng: '+demo.readyState; } function setTrackDetails() { demo.src = srcOfMedia; demo.load(); } </script> </body> </html>
Kết quả
Nhấn nút „Lấy trạng thái sẵn sàng“ khi chưa định nghĩa nguồn:
Nhấn nút „Lấy trạng thái sẵn sàng“ khi đã định nghĩa nguồn:
