html - detect if video.load is successful or not - javascript - Stack Overflow

admin管理员组

文章数量:1344505

How can I know if load of a song is successfull? something like:

video.load({
        success : function() {
            alert("loading successful");
        },
        failure : function() {
            alert("loading not successful");
        } 
    });

I have list of songs to play, and if suddenly there is a problem with internet connection and next video can't be played, I want to play the next song that already have been laoded..

Thanks a lot!

How can I know if load of a song is successfull? something like:

video.load({
        success : function() {
            alert("loading successful");
        },
        failure : function() {
            alert("loading not successful");
        } 
    });

I have list of songs to play, and if suddenly there is a problem with internet connection and next video can't be played, I want to play the next song that already have been laoded..

Thanks a lot!

• javascript
• html
• html5-video

Share Improve this question Follow asked Sep 19, 2015 at 13:21 user2320431user2320431 11511 gold badge22 silver badges1515 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 9

It depends on what you call a success when loading a video. Being able to fully play the video is one thing and just loading the metadata is another, and there are events for each. Same with failure: Would you consider a very long period of buffering an error?

Please refer to the list of events fired by HTMLMediaElement here: https://developer.mozilla/en-US/docs/Web/API/HTMLMediaElement

As for listening to these events, this code might be helpful:

var v = document.createElement("VIDEO");

v.addEventListener("error", function (e) {
    console.log("Error while loading the video");
});

v.addEventListener("loadeddata", function () {
    console.log("Video has started loading successfully!");
});

v.src = "http://mondatastorage.googleapis./gtv-videos-bucket/sample/BigBuckBunny.mp4";

You can use the error property of the html5 video tag (but this seems to be IE only at this time). Another approach (for FireFox) is HTML 5 Video Error handling in Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1).

To detect that all child elements have failed to load, check the value of the media element's networkState attribute. If this is HTMLMediaElement.NETWORK_NO_SOURCE, you know that all the sources failed to load.

Hope this helps!

本文标签： htmldetect if videoload is successful or notjavascriptStack Overflow