使用jQuery在Dom加载上自动播放HTML5视频

我正在尝试使用jQuery加载dom后立即播放视频。这是我的代码：

HTML

<video id="video" width="420">
  <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
  <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
  <p>Your browser does not support HTML5 video.</p>
</video>

---

当你加载的视频没有播放，我哪里出错了？提前感谢。

jQuery选择器

$（“#视频”）

返回jQuery对象。由于

play（）

是DOM元素的函数，因此必须使用以下内容获取DOM元素：

$("#video").get(0);

在使用.play（）方法之前：

编辑：您还可以使用HTML5选择的标记，以防jQuery回退。注意

autoplay

标记

<video controls="controls" autoplay="autoplay" loop="loop"
width="233" height="147" poster="//www.cdn.com//video.png"
preload="auto" title="Video">
    <source src="//www.cdn.com/video.mp4" type="video/mp4"/>
    <source src="//www.cdn.com/video.ogv" type="video/ogv"/>
    <source src="//www.cdn.com/video.webm" type="video/webm"/>
</video>

---

我知道不是jQuery，但在标准javascript和html5中，您可以使用：

var video = document.getElementById("target_video");
video.autoplay = true;
video.load(); 

---

如前所述，

play（）

方法存在于自身上，因此首先必须将jQuery对象解析为特定节点。但是，如果具有

id=“video”

的元素不存在或不是

video

节点，则他的解决方案将引发错误。

我尝试了此操作，但得到了错误：未捕获的语法错误：意外标记非法更新。您需要在选择器周围放置

”

。

<video controls="controls" autoplay="autoplay" loop="loop"
width="233" height="147" poster="//www.cdn.com//video.png"
preload="auto" title="Video">
    <source src="//www.cdn.com/video.mp4" type="video/mp4"/>
    <source src="//www.cdn.com/video.ogv" type="video/ogv"/>
    <source src="//www.cdn.com/video.webm" type="video/webm"/>
</video>

var video = document.getElementById("target_video");
video.autoplay = true;
video.load(); 

$('video#video').each( (i,e) => e.play() );