Video failed to trigger oncanplay event

if the address of the video is a local file, you can"t trigger the oncanplay event to change the address to a URL. That"s why

related codes

/ / < video id= "video" controls width= "100% >

     <source src="1.mp4" type="video/mp4">
         <!-- <source src="https://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"> -->
</video>
<script>    
    window.onload = function() {    
        var video = document.getElementById("video");
        video.addEventListener("canplay", function() {
        console.log(video.duration);
        })
    }


Jul.12,2022

maybe it is too fast to add the memory, for example, the memory has been added, while the Canplay event will occur once and only once it can be played. So he has two characteristics:
1. There is no need to add a complete package
2. Send only once

so it may occur before video.addEventListener after window.onload, and the second problem is that if you put your script in the back, you don't need window.onload, because you need to add data from top to bottom and add to the cost, so you have already completed the above data processing. At this time, you have scheduled the onload event, probably because the increase is too fast so that the onload has already been triggered before confirmation. So the face-to-face will fail.

A technique for scheduling: add console.log or alert to different execution segments to see which are running, which are not, and where the code is parked. This may be that onload itself is not running, so you can monitor events naturally.

Menu