Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ played ของ Video ใน HTML DOM

คุณสมบัติ played ของ HTML DOM Video ใช้สำหรับคืนค่าอ็อบเจกต์ TimeRanges ที่มีข้อมูลเกี่ยวกับช่วงที่เล่นแล้ว (played) ของวิดีโอ รวมถึงความยาว ตำแหน่งเริ่มต้น และตำแหน่งสิ้นสุด

ไวยากรณ์ (Syntax)

การคืนค่าอ็อบเจกต์ TimeRanges

mediaObject.played

ตัวอย่างการใช้งาน

ตัวอย่างต่อไปนี้แสดงการใช้งานคุณสมบัติ Video played:

<!DOCTYPE html> <html> <head> <title>HTML DOM Video played</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-played</legend>          <video id="demo" width="320" controls><source          src="https://www.tutorialspoint.com/html5/foo.mp4" type="video/mp4"></video><br>          <input type="button" onclick="getTrackDetails()" value="How much free view time is left?">          <div id="divDisplay"></div>          </fieldset>    </form>    <script>       var divDisplay = document.getElementById("divDisplay");       var demo = document.getElementById("demo");       demo.autoplay =true;       var limit = 5;       function getTrackDetails() {          divDisplay.textContent = 'You have '+(limit - demo.played.end(0))+' seconds left';       }    </script> </body> </html>

ผลลัพธ์

คลิกปุ่ม 'How much free view time is left?' ขณะวิดีโอเล่นอยู่:

คุณสมบัติ played ของ Video ใน HTML DOM

คลิกปุ่ม 'How much free view time is left?' หลังเล่นวิดีโอไปสักพัก:

คุณสมบัติ played ของ Video ใน HTML DOM