美文网首页
html5利用jquery获取上传视频时长

html5利用jquery获取上传视频时长

作者: syncwt | 来源:发表于2016-07-19 17:23 被阅读1378次
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>getVideoLength</title>
        </head>
    
        <body>
            <div>
                <input type="file" multiple="" name="videoUrl" id="videoUrl" onchange="FileValue(this)">
            </div>
            <div>
                <video id="myvideo"></video>
            </div>
    
            <script src="js/jquery-1.8.3.min.js"></script>
            <script>
                function FileValue(val) {
                    var file = val.files[0];
                    var url = URL.createObjectURL(file);
                    $("#myvideo").prop("src", url);
                    $("#myvideo")[0].addEventListener("loadedmetadata", function() {
                        var tol = this.duration; //获取总时长
                        alert("时长:" + tol);
                    });
                }
            </script>
    
        </body>
    
    </html>
    
    运行截图

    参考 http://blog.sina.com.cn/s/blog_6f0c17360102vv4r.html

    相关文章

      网友评论

          本文标题:html5利用jquery获取上传视频时长

          本文链接:https://www.haomeiwen.com/subject/icomjttx.html