JS的video获取时长,出现问题汇总

<video id="my_video_1" controls="controls" style="  700px; height: 420px; margin: 0 auto; padding-top: 0px;"> <source src="@ViewBag.Url " type="application/x-mpegURL"> </video>

1,video在一部分手机可以播放,然而在一部分手机不可以播放的原因:这两个属性没添加 controls="controls"和autoplay="autoplay"

2,使用JQ获取video对象获取时长报错,根据我的调试发现,然而使用源生JS获取video对象获取时长成功:

获取不了:

$("#my_video_1").duration

获取时长:

document.getElementById("my_video").duration;

3,异步绑定获取video地址,后获取时长问题:

1》异步没success获取时长是失败的,一直为NAN

        var video = document.getElementById("my_video_1");
        $.ajax({
            type: "POST",
            url: "/Home/getVidUrl",
            data: "",
            success: function (json) {
                if (json != "") {
                    getVidDur();
                    $("#test").append(" <video id='my_video_" + i + "' controls='controls' style='  100px; height: 200px; margin: 0 auto; padding-top: 0px;'> <source src='" + json + " ' type='application/x-mpegURL'> </video>");
                    i++;
                    //var video1 = document.getElementById("my_video_" + i + ""); //异步没加载完成获取时长是失败的
                    //alert(video1.duration)
                    //alert(json);
                }
                else {
                    alert("加载完成");
                }
            },
        });

而我们需要写下面方法调用获取:

 function getVidTime() {
        var json = [];
        for (var j = 1; j <= i - 1; j++) {
            var video = document.getElementById("my_video_" + j);
            alert(video.duration);
        }
   }
原文地址:https://www.cnblogs.com/May-day/p/8297975.html