欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

video视频属性、获取视频时间

程序员文章站 2024-02-08 10:52:34
...
    <button id="btn" onclick="getInfo()">提交</button>
    <div>
        <!-- 
            属性:
                autoplay="autoplay"  如果出现该属性,则视频在就绪后马上播放
                controls="controls"  如果出现该属性,则向用户显示控件,比如播放按钮
                loop="loop"   如果出现该属性,则当媒介文件完成播放后再次开始播放
                muted="muted"   静音
                poster="url"  规定视频下载时显示的图像,或在用户点击播放按钮前的图像
                preload="auto"  预加载
         -->
        <video src="./images/6666.mp4" height="400" preload="auto" poster="./images/swipers/bg01.jpg" controls
            id="player"></video>
    </div>

duration获取视频的准确时间s,但是视频controls上只显示正数

<script>
    var time;
    window.onload = function () {
        var pl = document.getElementById("player");
        // 视频时间只显示整数
        time = parseInt(pl.duration);
        alert(time);
    }
    function getInfo() {
        var pl = document.getElementById("player");
        // 视频时间只显示整数
        time = parseInt(pl.duration);
        alert(time);
        return false;
    }
</script>

注意:不支持视频预加载的浏览器不支持此方式。