The loadeddata
event is fired when the frame at the current playback position of the media has finished loading; often the first frame.
Note: This event will not fire in mobile/tablet devices if data-saver is on in browser settings.
The loadeddata
event is fired when the frame at the current playback position of the media has finished loading; often the first frame.
Note: This event will not fire in mobile/tablet devices if data-saver is on in browser settings.
Use the event name in methods like addEventListener()
, or set an event handler property.
addEventListener("loadeddata", (event) => {});
onloadeddata = (event) => {};
A generic Event
.
These examples add an event listener for the HTMLMediaElement's loadeddata
event, then post a message when that event handler has reacted to the event firing.
Using addEventListener()
:
const video = document.querySelector("video");
video.addEventListener("loadeddata", (event) => {
console.log(
"Yay! The readyState just increased to " +
"HAVE_CURRENT_DATA or greater for the first time.",
);
});
Using the onloadeddata
event handler property:
const video = document.querySelector("video");
video.onloadeddata = (event) => {
console.log(
"Yay! The readyState just increased to " +
"HAVE_CURRENT_DATA or greater for the first time.",
);
};
Specification |
---|
HTML # handler-onloadeddata |
BCD tables only load in the browser
playing
eventwaiting
eventseeking
eventseeked
eventended
eventloadedmetadata
eventcanplay
eventcanplaythrough
eventdurationchange
eventtimeupdate
eventplay
eventpause
eventratechange
eventvolumechange
eventsuspend
eventemptied
eventstalled
event