0

我正在尝试通过 File API 获取上传的视频文件的持续时间。我有以下html代码：

<div class="row">  
  <div class="twelve columns" style="margin:30px 0px 0px 0px; width:560px;">
    <label for="fileToUpload">Select a File to Upload</label>
    <input type="file" name="postedFile" id="file" onchange="previewMedia(this)"/>                
    <div id="progressNumber"></div>
  </div>
</div>

<div id="mediaHolderDiv" hidden>
  <div id ="videoHolderDiv" hidden>
    <video id="videoHolder" width="640" height="360" controls><source src="#" type="video/mp4"></video>
  </div>
  <div id="audioHolderDiv" hidden>
    <audio preload="auto" controls id="audioHolder"><source src="#" type="audio/mp3"></audio>
  </div>
</div>

以及以下 Javascript：

function previewMedia(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();
        reader.onload = function (e) {
            //the only jQuery line.  All else is the File API.
            var extension = input.files[0].name.split('.').pop();
            alert("YOUR EXTENSIONS IS :" + extension);
            if (extension == 'mp4') {
                alert("BINGO A VIDEO");
                $('#mediaHolderDiv').show();
                $('#audioHolderDiv').hide();
                $('#videoHolderDiv').show();
                $('#videoHolder').attr('src', e.target.result);
                var duration = $('#videoHolder').get(0);
                setTimeout(function () {
                    alert("File successfully chosen. Please enter required metadata below.");
                    var vid_duration = duration.duration;
                    alert(vid_duration);
                    var seconds = Math.floor(vid_duration % 60);
                    alert("SECONDS:" + seconds);
                    var minutes = Math.floor(vid_duration / 60);
                    alert("MINUTES:" + minutes);
                    var hours = Math.floor(vid_duration / (60 * 60));
                    alert("HOURS:" + hours);
                    var durationString = "" + hours + ":" + minutes + ":" + seconds;
                    alert("DURATION" + durationString);
                    duration.firstChild.nodeValue = vid_duration;
                }, 1000);
            }
            else if (extension == 'mp3') {
                alert("BINGO AN MP3");
                $('#mediaHolderDiv').show();
                $('#videoHolderDiv').hide();
                $('#audioHolderDiv').show();
                $('#audioHolder').attr('src', e.target.result);
                var duration = $('#audioHolder').get(0);
                setTimeout(function () {
                    alert("File successfully chosen. Please enter required metadata below.");
                    var vid_duration = duration.duration;
                    alert(vid_duration);
                    var seconds = Math.floor(vid_duration % 60);
                    alert("SECONDS:" + seconds);
                    var minutes = Math.floor(vid_duration / 60);
                    alert("MINUTES:" + minutes);
                    var hours = Math.floor(vid_duration / (60 * 60));
                    alert("HOURS:" + hours);
                    var durationString = "" + hours + ":" + minutes + ":" + seconds;
                    alert("DURATION" + durationString);
                    duration.firstChild.nodeValue = vid_duration;
                }, 1000);
            }
        }
        reader.readAsDataURL(input.files[0]);
    }
}

这适用于 Google Chrome 和 Firefox 上的视频，但是当我尝试在 IE10 中使用 PreviewMedia 功能时，我收到一个错误：不支持的视频类型或无效 的文件路径文件路径有效且文件类型为 mp4 所以我无法理解问题。有没有人在此之前看到过此问题或知道该问题的任何解决方法？

4

0 回答 0