Question

我正在编写一些JavaScript来移动视频的播放头。该视频由一系列部分组成，这些部分依次播放然后停止。一排按钮会将播放头发送到特定部分。

视频是一个动画片段，在各个部分之间是无缝的。为了保持这种无缝的质量，当按下部分按钮时，需要先将各个部分播放到最后，然后再跳到新的章节。

一个例子：

•播放头暂停7秒，本节结束时10秒。

•用户点击按钮3移至30秒标记。

•当前部分必须播放10秒才能结束。

•当前部分完成后，然后播放头可以跳到30秒标记。

这是我遇到的障碍：当使用onClick（）调用时，每个按钮函数运行两次。第一次运行时，if语句将始终指向else。

var vid=document.getElementById("neufVideo");

Object.defineProperty(HTMLMediaElement.prototype, 'playing', {
    get: function(){
        return !!(this.currentTime > 0 && !this.paused && !this.ended && this.readyState > 2);
    }
});

function playPause() {
    console.log("playPause");
    if(vid.playing){
        console.log("playPause pause");
        vid.pause();
    } else {
        console.log("playPause play");
        vid.play();
    }
}

var button2 = function(){
    console.log("button2");
    window.vid=document.getElementById("neufVideo");
    vid.addEventListener("timeupdate",button2);
    vid.play();
    if(this.currentTime >= 5){
        // remove the event listener
        this.removeEventListener("timeupdate",button2);
        this.currentTime = 0;
        this.play();
        console.log("button2 condition 'currentTime >= 5' met");
        //return;
    } else {
        console.log("button2 else");
        this.removeEventListener("timeupdate",button2);
        //return;
    }
    //return;
};

var button1 = function(){
    console.log("button1");
};

您可以在https://micadesign.ca/neuf/上看到带有视频的测试页

我对编码非常陌生，所以如果我要解决所有这些错误，我很乐意指出正确的方向。

（顺便说一句，播放头场景不会超过五个，所以我不是在考虑可以扩展的更复杂解决方案的思路。）

谢谢！

Javascript功能可有条件地移动视频播放头两次运行

0 个答案: