HTML Audio/Video DOM timeupdate Event

❮ HTML Audio/Video DOM-referentie

Voorbeeld

Wanneer de afspeelpositie van een video is gewijzigd, geeft u de huidige positie van de video in seconden weer:

// Get the <video> element with id="myVideo"
var vid = document.getElementById("myVideo");

// Assign an ontimeupdate event to the <video> element, and execute a function if the current playback position has changed
vid.ontimeupdate = function() {myFunction()};

function myFunction() {
// Display the current position of the video in a <p> element with id="demo"
    document.getElementById("demo").innerHTML = vid.currentTime;
}

Meer "Probeer het zelf" voorbeelden hieronder.


Definitie en gebruik

De timeupdate-gebeurtenis vindt plaats wanneer de afspeelpositie van een audio/video is gewijzigd.

Deze gebeurtenis wordt aangeroepen door:

  • De audio/video afspelen
  • De afspeelpositie verplaatsen (zoals wanneer de gebruiker snel vooruitspoelt naar een ander punt in de audio/video)

Tip: Deze timeupdate-gebeurtenis wordt vaak gebruikt in combinatie met de eigenschap currentTime van het audio/video-object, die de huidige positie van het afspelen van audio/video in seconden teruggeeft.


Browserondersteuning

De cijfers in de tabel geven de eerste browserversie aan die de gebeurtenis volledig ondersteunt.

Event
timeupdate Yes 9.0 Yes Yes Yes

Syntaxis

In HTML:

<audio|video ontimeupdate="myScript">

In javascript:

audio|video.ontimeupdate=function(){myScript};

In JavaScript, met behulp van de addEventListener()-methode:

audio|video.addEventListener("timeupdate", myScript);

Technische details

Ondersteunde HTML-tags: <audio> en <video>
Ondersteunde JavaScript-objecten: Audio Video

Meer voorbeelden

Voorbeeld

Wanneer de afspeelpositie van een audio is gewijzigd, geeft u de huidige positie van de audio in seconden weer:

// Get the <audio> element with id="myVideo"
var aud = document.getElementById("myVideo");

// Assign an ontimeupdate event to the <audio> element, and execute a function if the current playback position has changed
aud.ontimeupdate = function() {myFunction()};

function myFunction() {
// Display the current position of the audio in a <p> element with id="demo"
    document.getElementById("demo").innerHTML = aud.currentTime;
}

Voorbeeld

Gebruik de eigenschap currentTime om de huidige afspeelpositie in te stellen op 5 seconden:

document.getElementById("myVideo").currentTime = 5;

❮ HTML Audio/Video DOM-referentie