html5视频 - 正在播放一个视频而其他视频没有播放

Question

目前我正在制作html5视频和视频格式为 MP4 。我的代码如下：

    <video id="vid" preload="auto" loop autoplay>
    <source src="path to video.mp4'; ?>" type="video/mp4">
    Your Browser doesn't support video.
  </video>
  <video id="vid1" preload="auto" loop autoplay>
    <source src="path to video1.mp4'; ?>" type="video/mp4">
    Your Browser doesn't support video.
  </video>
  <video id="vid2" preload="auto" loop autoplay>
    <source src="path to video2.mp4'; ?>" type="video/mp4">
    Your Browser doesn't support video.
  </video>

但问题是ID为vid1 vid2的视频无法在任何浏览器上播放。虽然id​​ vid适用于所有浏览器。

我正在使用以下脚本播放：

   $("#vid").ready(function(){
      document.getElementById("vid").play();
});
$("#vid1").ready(function(){
      document.getElementById("vid1").play();
});
$("#vid2").ready(function(){
      document.getElementById("vid2").play();
});

第一个视频是工作文件。但是其他两个不是。我也试过了：

$("video").ready(function(){
    document.getElementById("vid").play();
        document.getElementById("vid1").play();
    document.getElementById("vid2").play();
});

可能的原因是什么？也没有控制台错误。