Question

我正在尝试创建一个视频，在点击按钮后跳转到视频中的某个点后自动播放。我有它，以便视频跳到现场，但我无法弄清楚如何让它从那里自动播放。我是javascript的新手，我认为可能有一个我想念的简单解决方案。

    function Fwd(){
        if (video.currentTime < 17.91 && video.currentTime >= 0)
        { (video.currentTime = 17.92)
        }
        else if (video.currentTime < 35.93 && video.currentTime > 17.91)
        { (video.currentTime = 35.94)
        }
    }

以下是我的一些HTML

<div id="sideright">
  <input type="button" id="fwdButton" onclick="Fwd()" class="button_fwdrew" />
</div>

<video id="video" width="896" height="504" data-setup="{}" >
<source src="video/myAwesomeVideo.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="video/myAwesomeVideo.webmhd.webm" type='video/webm; codecs="vp8, vorbis"'>
<source src="video/myAwesomeVideo.oggtheora.ogv" type='video/ogg; codecs="theora, vorbis"' />
<p>Your browser doesn't support HTML5. Maybe you should upgrade.</p>
</video>

这是我的更多JavaScript

var v = document.getElementById("video")[0];
    v.volume = .5;
    v.pause();
    video.onpause = video.onplay = function(e) {
    playpause.value = video.paused ? 'Play' : 'Pause';
        }

Answer 1

video.play()不起作用吗？

function Fwd(){
    var video = document.getElementById("video");
    if (video.currentTime < 17.91 && video.currentTime >= 0)
    { 
        (video.currentTime = 17.92)
    }
    else if (video.currentTime < 35.93 && video.currentTime > 17.91)
    { 
        (video.currentTime = 35.94)
    }
    video.play();
}

我添加了video变量的声明，因为这似乎引起了一些混乱。

在您的编辑中，您创建了一个v变量，但您已为其分配了与id video元素关联的DOM对象的第一个属性或方法的值（这是[0]之后数组访问者document.getElementById("video")所做的事情。几乎可以肯定，该属性或方法本身不具有属性volume或方法pause()。之后，您开始使用video变量，而无需明确定义或设置其值。它可以在你没有发布的代码中定义，但是从你所展示的内容中可能是一种浪费，因为你显然试图让v变量成为视频元素的引用 - 没有必要适用于v和video。

决定使用一个变量来保存对视频元素的引用，使用document.getElementById("video")进行分配，然后一致地使用它。

Answer 2

var update = function() {
    if (document.getElementById("video").currentTime < 10) 
    {
        document.getElementById("video").currentTime = 10;
    }
};
document.getElementById("video").setAttribute("ontimeupdate", "update();");
document.getElementById("video").play();

跳转到html5视频中的当前时间后自动播放

2 个答案: