无法通过设置 video.currentTime = {value} 来设置 video.currentTime
2015-12-23
242
在这段代码中,我有
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);
1个回答
刷新页面会停止所有代码执行并重置所有变量,基本上是从头开始。
如果您希望变量在刷新页面后仍然保留,请设置 localStorage,您的值将保存在浏览器中。如果您在 localStorage 下的资源部分中打开开发人员工具,则可以找到它们:
localStorage.setItem(video.currentTime,value)
要检索它,您必须使用
localStorage.getItem(video.currentTime,value)
Michael Ericson
2015-12-23