View video tutorial

HTML onsuspend Attribute

HTML

TThe HTML onsuspend attribute is an event handler used to specify a script that will run if the browser intentionally stops fetching media data(audio and video).

Definition and Usage


➔ This happens when the loading of media data is suspended or interrupted for some reason such as:

  • The download is complete, and no more data is needed at that point.
  • The download has been suspended due to some interruption.

➔ The accept attribute does not validate the selected file type, it provides hints to browsers to guide users in selecting the correct file type.

➔ This may not be an error condition, it simply says that the network state of the media element is NETWORK_IDLE.

Syntax
//In HTML
<video controls onsuspend="myFunction()" id="sample">
  <source src="video-source.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

//In javascript
document.getElementById("sample").onsuspend=function() {myFunction();};
//OR
document.getElementById("sample").addEventListener("suspend", myFunction);
//OR 
document.getElementById("sample").addEventListener("suspend", (event) => {
    myFunction();
 });

Applies to

This attribute can be used on the following element.

Attribute Element
onsuspend <audio>, <video>

Example
<!DOCTYPE html>
<html>
<head>
    <title>HTML onsuspend attribute example</title>
</head>
<body>
    <h3>HTML onsuspend attribute example</h3>
    <p>If the browser intentionally stops fetching media data, the event fires.</p>
    <!-- "https://mdn.github.io/learning-area/html/multimedia-and-embedding/video-and-audio-content/rabbit320.mp4" -->
    <video controls onsuspend="myFunction(event)" id="sample">
        <source src="video-source-path.mp4" type="video/mp4">
        This browser does not support the video tag.
    </video>
    <script>
        //In javascript
        //document.getElementById("sample").onsuspend=function() {myFunction();};
        //OR
        //document.getElementById("sample").addEventListener("suspend", myFunction);
        function myFunction(e) {            
            alert("The browser intentionally stops fetching media data. ");
        }
    </script>
</body>
</html>