onloadedmetadata Event

DOM Events Event Object

Definition and Usage

The onloadedmetadata event occurs when the metadata of the specified audio/video is loaded.

The metadata of audio/video includes: duration, dimensions (only for video), and text tracks.

The following events occur in the following order during the loading process of audio/video:

  1. onloadstart
  2. ondurationchange
  3. onloadedmetadata
  4. onloadeddata
  5. onprogress
  6. oncanplay
  7. oncanplaythrough

Example

Example 1

Execute JavaScript when loading video metadata:

<video onloadedmetadata="myFunction()">

Try It Yourself

Example 2

Execute JavaScript after loading audio metadata:

<audio onloadedmetadata="myFunction()">

Try It Yourself

Syntax

In HTML:

<element onloadedmetadata="myScript">

Try It Yourself

In JavaScript:

object.onloadedmetadata = function(){myScript};

Try It Yourself

In JavaScript, use the addEventListener() method:

object.addEventListener("loadedmetadata", myScript);

Try It Yourself

Note:Internet Explorer 8 and earlier versions do not support addEventListener() Method.

Technical Details

Bubbling: Not Supported
Cancelable: Not Supported
Event Type: Event
Supported HTML Tags: <audio> and <video>
DOM Version: Level 3 Events

Browser Support

The numbers in the table indicate the first browser version that fully supports the event.

Event Chrome IE Firefox Safari Opera
onloadedmetadata Support 9.0 Support Support Support
DOM Events Event Object