onstalled

The onstalled event in HTML is triggered when a media element fails to fetch data, signaling a loading problem that impacts playback.

onstalled event

The onstalled event in HTML occurs when the browser is unable to retrieve media data for an element, like <audio> or <video>. This event lets developers run actions or scripts to handle loading interruptions, improving error management and the user experience.

Syntax

script.js
addEventListener("stalled", (event) => {});
onstalled = (event) => {};

Event Type

A standard event used for various interactions.

Examples

The following examples demonstrate how to listen for the stalled event on an HTMLMediaElement and display a message when the event occurs.

  • Using addEventListener():
script.js
const video = document.querySelector("video");

video.addEventListener("stalled", (event) => {
  console.log("Failed to fetch data, but trying.");
});
  • Utilizing the onstalled Event Handler Property:
script.js
const video = document.querySelector("video");

video.onstalled = (event) => {
  console.log("Failed to fetch data, but trying.");
};

Values

Conclusion

The onstalled event helps handle situations where a media element cannot load data, indicating a loading issue. Developers can use this event to trigger error handling or display messages to the user. This improves the overall user experience by addressing playback interruptions.