Javascript html5视频倒数计时剩余时间

Javascript html5视频倒数计时剩余时间,javascript,jquery,html,html5-video,Javascript,Jquery,Html,Html5 Video,我最终解决了这个问题 $oVideo.bind('timeupdate', function() { var currVideo = document.getElementById("vPlayer"); //console.log(video.attr('id')); var iNow = currVideo.currentTime; //console.log(iNow); var countdown = eval(currVideo.duratio

我最终解决了这个问题

   $oVideo.bind('timeupdate', function() {
   var currVideo = document.getElementById("vPlayer");
    //console.log(video.attr('id'));
   var iNow = currVideo.currentTime;
     //console.log(iNow);
   var countdown = eval(currVideo.duration - iNow);
     // countdown = countdown /3600;
   $('.decr-time').html('-' + rectime(countdown));


     if (!bTimeSlide) {
    $oTimeSlider.slider('value', iNow);

     }
  });
嘿,我想提前感谢任何人

我需要为HTML5视频创建一个倒计时计时器。这是我能够拼凑出来的。我真的很感激任何能帮我解决这个问题的人。我的控制台没有显示倒计时错误;但我的倒计时似乎不起作用

 //count down
  $oVideo.bind('duration', function() {
          var countdown = $oVideo.duration - $oVideo.currentTime;
            $down.text(rectime(countdown));
          if (! bTimeSlide)
              $oTimeSlider.slider('value', countdown);
        });
下面是javaScript的一小部分

        var $oMain = $(this);
        var $oVideo = $('video', $oMain);
        var $oTimeSlider = $('.time_slider', $oMain);
        var $oTimer = $('.timer', $oMain);
        var $down = ('.decr-time', $oMain);
        var bTimeSlide = false;

 //count up
        $oVideo.bind('timeupdate', function() {
          var iNow = $oVideo[0].currentTime;
            $oTimer.text(rectime(iNow));
            if (! bTimeSlide)
                $oTimeSlider.slider('value', iNow);
        });



 ///count down
  $oVideo.bind('duration', function() {
          var countdown = $oVideo.duration - $oVideo.currentTime;
            $down.text(rectime(countdown));
          if (! bTimeSlide)
              $oTimeSlider.slider('value', countdown);
        });
HTML


00:00
-00:00

您已经知道会触发“timeupdate”事件,因此您应该能够在同一个处理程序中进行倒计时计算/显示

根据问题中的代码

$oVideo.bind('timeupdate', function() {
    var video = $(this).get(0);
    var iNow = video.currentTime;
    var countdown = video.duration - iNow;

    $oTimer.text(rectime(iNow));
    $down.text(rectime(countdown));

    if (!bTimeSlide) {
        $oTimeSlider.slider('value', iNow);
    }
});

编辑

Hello Beetroot感谢您的帮助,但这给了我值NaN:NaN只需要调试;可能是获取行
var countdown=$video.duration-iNow对。我是基于问题中的代码。尝试检查
$video.duration
以确保它返回您期望的值。对不起,我的错误,请参阅上面编辑的代码。谢谢。我就是这样修好它的。
$oVideo.bind('timeupdate', function() {
    var video = $(this).get(0);
    var iNow = video.currentTime;
    var countdown = video.duration - iNow;

    $oTimer.text(rectime(iNow));
    $down.text(rectime(countdown));

    if (!bTimeSlide) {
        $oTimeSlider.slider('value', iNow);
    }
});