Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/452.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何获取播放器持续时间、当前时间和视频帧或搜索位置(JQuery)_Javascript_Jquery_Css_Html5 Video_Html5 Audio - Fatal编程技术网

Javascript 如何获取播放器持续时间、当前时间和视频帧或搜索位置(JQuery)

Javascript 如何获取播放器持续时间、当前时间和视频帧或搜索位置(JQuery),javascript,jquery,css,html5-video,html5-audio,Javascript,Jquery,Css,Html5 Video,Html5 Audio,我能够把这些代码放在一起,得到播放器的持续时间、当前时间,并导出一个值,用于更新进度条的宽度 例如 var slideOff=Math.floor((100 / tDuration) *( tCurrent)); progBar.css({width:slideOff+'%'}); #seekbar{ border:none; width:480px; height:6px; background-color:#00ffcc; positi

我能够把这些代码放在一起,得到播放器的持续时间、当前时间,并导出一个值,用于更新进度条的宽度

例如

var slideOff=Math.floor((100 / tDuration) *( tCurrent)); 


progBar.css({width:slideOff+'%'});
#seekbar{
    border:none;
    width:480px;
    height:6px; 
    background-color:#00ffcc;   
    position:relative;
    margin:auto;

    }

    #seekLay{
    margin:0;
    height:4px;
    background-color:#001001;
    position:relative;
    top:1px;}

    #seeker{
    width:6px;
    height:100%;
    position:absolute;  
    left:0;    
    background-color:red;
    cursor:pointer;}
span{margin-left:30px;}
我的问题是,我也希望能够得到寻求的立场

例如,下面的代码工作正常,但搜索数字不符合或与当前时间相同

如果在上运行此代码,将得到如下结果:

持续时间29:05

当前时间2:25

搜索位置1:44这就是问题所在,我希望搜索位置在计算时与当前时间相同

Html

<div id="seekbar">

<div id="seeker"></div>

<div id="seekLay" ></div>

</div>
Duration<span id="currenT">00:00</span>

<br/>
Current Time<span id="durationT">00:00</span>


<br/>
SeekPosition <span id="resulk">00:00</span>
Javascript

String.prototype.pad = function(l, s){
return (l -= this.length) > 0 ? (s = new Array(Math.ceil(l / s.length) + 1).join(s)).substr(0, s.length) + this + s.substr(0, l - s.  length) : this;}

function playerTime(dcurT) {
       var tCurrent = dcurT  ,//player.getCurrentTime(),
           tDuration= 1745,  //player.getDuration(),
           dbar=$("#seekbar"),
           progressBar=$("#seeker"),
           progBar=$("#seekLay"),
           currenT = tCurrent,
           slideOff=Math.floor((100 / tDuration) *( tCurrent));      
    //Get current time
$('span#currenT').html(Math.floor(tDuration/ 60) + ":" + (tDuration % 60).toFixed().pad(2, "0"));
    //get duration
$('span#durationT').html(Math.floor(tCurrent / 60) + ":" + (tCurrent % 60).toFixed().pad(2, "0"));     
    //Update bars
progressBar.css({marginLeft:slideOff+'%'});
progBar.css({width:slideOff+'%'});

      //Get seek position

    var ratio=Math.floor((progBar.width())/progressBar.width()),           
        xpos=Math.floor( tDuration* (ratio / 100));

$('span#resulk').html(Math.floor(xpos / 60) + ":" + (xpos % 60).toFixed().pad(2, "0"));

      }
playerTime(145);//change

//Out Put
//Duration  29:05 
//Current Time   2:25 
//SeekPosition 1:44
我知道这不会花费你5分钟的时间来解决。

只需更改这一行即可 ============

换成这一行 ================

只需更改此行即可 ============

换成这一行 ==============

var ratio=Math.floor((progBar.width())/progressBar.width()),           
        xpos=Math.floor( tDuration* (ratio / 100));
var xpos=Math.floor(tDuration*progBar.width()/dbar.width());