如何在几秒钟内停止视频循环? 这是我的HTML代码
<video poster="images/banner-bg.jpg" id="bgvid" playsinline autoplay muted loop>
<source src="vid/MM_Logo_Identity.mp4" type="video/mp4" id="bgvid1">
</video>
脚本
document.getElementsByTagName('source').addEventListener('ended',myHandler,false);
function myHandler(e) {
console.log('ended');
setTimeout(function(){
document.getElementsByTagName('source').play();
}, 9000);
};
答案 0 :(得分:1)
您可以删除loop
属性,如下所示:
<video poster="images/banner-bg.jpg" id="bgvid" playsinline autoplay muted>
<source src="vid/MM_Logo_Identity.mp4" type="video/mp4" id="bgvid1">
</video>
答案 1 :(得分:0)
试试这段代码,它对您有用。
document.getElementsByTagName('source').addEventListener('ended', function() {
this.currentTime = 1;
}, false);
答案 2 :(得分:0)
正如一些评论所提到的,您可以删除循环属性以使其停止循环。您可以将其保留在 HTML 代码中,然后在您想停止循环时将其删除。
<video poster="images/banner-bg.jpg" id="bgvid" playsinline autoplay muted loop>
<source src="vid/MM_Logo_Identity.mp4" type="video/mp4" id="bgvid1">
</video>
// after 9 seconds, stop looping the video
setTimeout(function(){
const video = document.getElementById('bgvid');
video.removeAttribute("loop");
// optional: go back to the poster image when the video completes
video.removeAttribute("autoplay"); // remove autoplay too so it doesn't start again
video.addEventListener('ended', function() { video.load(); });
}, 9000);