HTML:
<video id="player" class="video-js vjs-default-skin" controls
preload="auto" width="400" height="264"
data-setup="{}">
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type='video/mp4'>
<source src="http://video-js.zencoder.com/oceans-clip.webm" type='video/webm'>
</video>
<a href="#">Click to play video</a>
<br>
<code></code>
JS:
var player = _V_("player");
var pasue_check = false;
$("a").click(function() {
player_play();
});
function player_play() {
$("#player").fadeIn();
$("a").fadeOut();
player.ready(function(){
player.play().addEvent("ended",player_ended);
player.addEvent("pause",player_pause);
player.play().addEvent("play",player_resume);
});
}
function player_ended() {
$("#player").fadeOut();
$("a").fadeIn();
if(pasue_check== true) {
clearInterval(countInterval);
pasue_check = false;
}
pasue_check = false;
}
function player_pause() {
count = 1;
countInterval = setInterval(function() {
$("code").html(count);
pasue_check = true;
if (count==5) {
player_ended();
}
count++
}, 1000);
}
function player_resume() {
if(pasue_check== true) {
clearInterval(countInterval);
pasue_check = false;
}
}
现场测试:http: //jsfiddle.net/973gT/
我尝试使用 setInterval 和 clearInterval ,但是当我计数和暂停计数时它的效果并不好。
有时它会像 2-4-6 一样计数......或无法清除间隔
有人可以帮助我吗,我做错了什么?