Question

在这段代码中我有video.currentTime = {value} 它工作正常。

但是当我尝试按Crtl+Shift+R重新加载页面时，它会将video.currentTime设置为 0 ，无论我在点击的进度条上是什么时候。那是为什么？

window.addEventListener('load', function(){

var video = document.getElementById('video');
var playButton = document.getElementById('play-button');
var pbar = document.getElementById('pbar');
var update;
var pbarContainer = document.getElementById('pbar-container');

video.load();
video.addEventListener('canplay', function(){
    playButton.addEventListener('click', playOrPause, false);
    pbarContainer.addEventListener('click', skip, false);
}, false);

var skip = function(ev) {
    var mouseX = ev.pageX - pbarContainer.offsetLeft;
    var width = window.getComputedStyle(pbarContainer).getPropertyValue('width');
    width = parseFloat(width.substr(0, width.length - 2));

    video.currentTime = (mouseX/width)*video.duration;
};


var updatePlayer = function() {
    var percentage = (video.currentTime/video.duration)*100;
    pbar.style.width = percentage + '%';
    if(video.ended) {
        window.clearInterval(update);
        playButton.src = 'images/replay.png';
    }
};

var playOrPause = function(){

    if(video.paused) {
        video.play();
        playButton.src = 'images/pause.png';
        update = setInterval(updatePlayer, 30);
    } else {
        video.pause();
        playButton.src = 'images/play.png';
        window.clearInterval(update);
    }
};

//video.addEventListener('click', playOrPause(playButton), false);
}, false);

Answer 1

刷新页面会停止所有代码的执行并重置所有变量，基本上从头开始。

如果您希望在刷新页面后仍保留变量，则设置localStorage，您的值将保存在浏览器中。如果您在localStorage下的参考资料部分打开开发人员工具，则可以找到它们：

localStorage.setItem(video.currentTime,value)

要检索它，您必须使用

localStorage.getItem(video.currentTime,value)

无法通过设置video.currentTime = {value}来设置video.currentTime

1 个答案: