Question

我正在使用jQuery / CSS创建自定义HTML5视频播放器，（几乎）一切正常。

但在Firefox中，它不会显示时间（当前时间和持续时间）。它只会在您点击播放按钮后显示。在所有其他浏览器中，时间显示在网站加载后。

这是我的代码：

$(document).ready(function(){
    $("video").on("timeupdate", function(event) {

        var currentTime = this.currentTime;
        var duration = this.duration;

        var minutes = Math.floor(currentTime / 60);
        var seconds = Math.round(currentTime - minutes * 60);
        var tminutes = Math.floor(duration / 60);
        var tseconds = Math.round(duration - tminutes * 60);

        if(minutes < 10) { minutes = '0'+minutes; }
        if(tminutes < 10) { tminutes = '0'+tminutes; }
        if(seconds < 10) { seconds = '0'+seconds; }
        if(tseconds < 10) { tseconds = '0'+tseconds; }

        $("#current").text(minutes+':'+seconds);
        $("#duration").text(tminutes+':'+tseconds);

    });
});

我试图将on更改为ready m，但没有任何运气。

我也在某处读到"timeupdate"应该是"seeked"而video应该是<video preload="auto|metadata|none">，但这里的结果相同。

仅在Firefox中，时间不会显示。

任何知道该怎么做的人？

我创建了一个非常简单的演示，它显示了我的问题：

Fiddle Demo

希望有人可以帮助我：D

谢谢--YaXxE

Answer 1

而不是使用我使用的$("video").on("timeupdate", function(event) {...});：

var $spc = $("video")[0],
    duration = $spc.duration,
    currentTime = $spc.currentTime;

..这似乎适用于包括Firefox在内的所有浏览器：）

HTML5视频timeupdate函数无法正常工作

1 个答案: