无法使用IE10检索某些MP4文件的持续时间适用于所有其他浏览器

时间:2013-09-20 10:21:40

标签: javascript jquery html5 html5-audio fileapi

我正在尝试通过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所以我无法理解这个问题。有没有人见过这个或知道这个问题的任何变通方法?

0 个答案:

没有答案