Evento de atualização de tempo do DOM de áudio/vídeo HTML

❮ Referência HTML de áudio/vídeo DOM

Exemplo

Quando a posição de reprodução de um vídeo for alterada, exiba a posição atual do vídeo em segundos:

// 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;
}

Mais exemplos de "Experimente você mesmo" abaixo.


Definição e uso

O evento timeupdate ocorre quando a posição de reprodução de um áudio/vídeo foi alterada.

Este evento é invocado por:

  • Reproduzindo o áudio/vídeo
  • Movendo a posição de reprodução (como quando o usuário avança rapidamente para um ponto diferente no áudio/vídeo)

Dica: Este evento timeupdate é frequentemente usado em conjunto com a propriedade currentTime do objeto Audio/Video, que retorna a posição atual da reprodução de áudio/vídeo, em segundos.


Suporte ao navegador

Os números na tabela especificam a primeira versão do navegador que oferece suporte total ao evento.

Event
timeupdate Yes 9.0 Yes Yes Yes

Sintaxe

Em HTML:

<audio|video ontimeupdate="myScript">

Em JavaScript:

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

Em JavaScript, usando o método addEventListener():

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

Detalhes técnicos

Tags HTML suportadas: <áudio> e <vídeo>
Objetos JavaScript suportados: Áudio vídeo

Mais exemplos

Exemplo

Quando a posição de reprodução de um áudio for alterada, exiba a posição atual do áudio em segundos:

// 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;
}

Exemplo

Usando a propriedade currentTime para definir a posição de reprodução atual para 5 segundos:

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

❮ Referência HTML de áudio/vídeo DOM