javascript - Safari 视频不工作，但所有浏览器工作自动播放。多个视频一个一个播放

Question

**html5 video safari 自动播放不工作??????????我的多个视频一个接一个播放的代码运行良好，但它在 safari 浏览器中不起作用有任何方法可以在 safari 中启动自动播放也请帮助我这个查询。在 safari 浏览器中使用和工作的任何方式。有任何其他工作方式可以使用它。谢谢代码只是 HTML 和 js CSS，我正在使用它们来创建 id 并用于在浏览器中播放视频。**

    <div class="video-container " id="video_auto_play">
<video autoplay="autoplay" controls muted id="home_videoPlayer" style="object-fit: initial;" >
  <source id="home_videoPlayer" style="object-fit: initial;"  type="video/mp4" />
</video>
<script> 
    document.getElementById('home_videoPlayer').play(); 
</script>
</div>


<script>
var videoSource = new Array();


videoSource[0] = 'a1.mp4';
videoSource[1] = 'a2.mp4';
videoSource[2] = 'a3.mp4';
videoSource[3] = 'a4.mp4';

var i = 0; // define i
var videoCount = videoSource.length;

function videoPlay(videoNum) {
    document.getElementById("home_videoPlayer").setAttribute("src", videoSource[videoNum]);
    document.getElementById("home_videoPlayer").play();
    document.getElementById("home_videoPlayer").play();
}
document.getElementById('home_videoPlayer').addEventListener('ended', myHandler, false);
videoPlay(0); // play the video

function myHandler() {
    i++;
    if (i == (videoCount - 0)) {
        i = 0;
        videoPlay(i);
    } else {
        videoPlay(i);
    }
}
</script>

Answer 1

它工作正常。您是否在菜单栏中检查了 Safari > 此网站的设置？

   document.getElementById('home_videoPlayer').play(); 


var videoSource = new Array();


videoSource[0] = 'https://www.w3schools.com/tags/movie.mp4';
videoSource[1] = 'https://www.w3schools.com/tags/movie.mp4';
videoSource[2] = 'https://www.w3schools.com/tags/movie.mp4';
videoSource[3] = 'https://www.w3schools.com/tags/movie.mp4';

var i = 0; // define i
var videoCount = videoSource.length;

function videoPlay(videoNum) {
    document.getElementById("home_videoPlayer").setAttribute("src", videoSource[videoNum]);
    document.getElementById("home_videoPlayer").play();
    document.getElementById("home_videoPlayer").play();
}
document.getElementById('home_videoPlayer').addEventListener('ended', myHandler, false);
videoPlay(0); // play the video

function myHandler() {
    i++;
    if (i == (videoCount - 0)) {
        i = 0;
        videoPlay(i);
    } else {
        videoPlay(i);
    }
}

<div class="video-container " id="video_auto_play">
<video autoplay="autoplay" controls muted id="home_videoPlayer" style="object-fit: initial;" >
  <source id="home_videoPlayer" style="object-fit: initial;"  type="video/mp4" />
</video>
</div>