Html 动态加载和播放 HTML5 视频

Dynamically Load and Play HTML5 video

提问by Ricky

I'm trying to load and play a HTML5 video onClick event. But i'm not able to accomplish this :-/

我正在尝试加载和播放 HTML5 视频 onClick 事件。但我无法做到这一点：-/

Here's my HTML5:

这是我的 HTML5：

<div id="divVideo">
    <video id="video" controls width="560">
        <source id="mp4" type="video/mp4" />
    </video>
</div>

<div onclick="loadVideo('Muse-Animals.mp4');">play</div>

Here's my JS:

这是我的JS：

function loadVideo(id)
{
    var video = document.getElementById('video');
    var mp4 = document.getElementById('mp4');

    mp4.src = "vidz/" + id;

    video.load();
    video.play();
}

I checked the element and it does update the video tag properties, but doesn't load or play the video.

我检查了元素，它确实更新了视频标签属性，但不加载或播放视频。

What am i doing wrong?

我究竟做错了什么？

回答by Vinay Pratap Singh

First of all check if you are giving the video src static then it is getting played or not. if it is getting played then while giving it dynamically try giving an extra variable in the src to make the video source refresh itself

首先检查你是否给视频 src 静态然后它是否被播放。如果它正在播放，则在动态提供时尝试在 src 中提供一个额外的变量以使视频源自行刷新

like

喜欢

function loadVideo(id)
{
var video = document.getElementById('video');
var mp4 = document.getElementById('mp4');
d = new Date();

mp4.src = "vidz/" + id + d.getTime();

video.load();
video.play();
}