Javascript 如何使用Safari mobile检测输入文件中被忽略的大文件

Safari mobile

忽略传入的大型文件（当前正在使用进行测试）

这样做时，输入不会触发任何事件（无更改、无错误、无任何内容）。它只是忽略用户操作

为了通知我们的用户，是否需要检测何时发生这种情况

此处的测试用例：

---

编辑：因为这看起来确实像一个

---

Safari但是，我在Safari bug追踪器上打开了问题#16862230（我会留下一个链接，但没有…哦，苹果…），如果你能复制，请对这个问题发表评论

我在iFadey上找到一篇关于计算上传文件大小的文章：

这是JavaScript：

document.addEventListener( 'DOMContentLoaded', function() {
    var inputImg = document.getElementById( 'inputImg' );

    inputImg.addEventListener( 'change', function( e ) {
        var fileSize = getFileSize( inputImg );

        if( fileSize > -1 ) {
            document.getElementById( 'fileSize' ).innerHTML = ( fileSize / 1024 ).toFixed( 2 ) + ' KB';
}
        else
            document.getElementById( 'fileSize' ).innerHTML = 'Failed to get file size';
    }, false );
}, false );

function getFileSize( inputFile ) {
    var files = inputFile.files;

    if( !files ) {
        //for IE
        try {
            var fs = new ActiveXObject( 'Scripting.FileSystemObject' );
            var file = fs.getFile( inputFile.value );
            return file.size;
        } catch( ex ) {
            return -1;
        }

    } else if( files.length > 0 ) {
        //for rest of the world
        return files[ 0 ].size;
    }
}

当然，您只需要

files.length>0

部分代码，因为您的目标是Safari（不是IE），但我还是发布了全部代码。 添加此脚本后，我可以在iPhone Safari上上传13MB的视频。它被自动压缩，但脚本仍然返回实际的文件大小

请看这里：

试试看，让我知道它是否有效

编辑：如果要将上载文件的最大大小设置为10 MB，请将以下内容添加到代码中：

    if(fileSize > 10485760) {
alert("Your file is too large to be uploaded");
inputImg.value = "";
document.getElementById( 'fileSize' ).innerHTML = "";
}

---

更新的JS-Bin:

我编辑了答案，其中包含了一个方法，用于在文件超过10 MB时通知用户（您可以将其更改为任何值-以字节为单位）。然而，即使我添加了检查文件大小的代码，它似乎也能正确上传。你自己试试看，如果有用就告诉我。干杯我在iOS上测试了你的jsBin，它对我不起作用。我能看到的唯一区别是，我试图上传一个10mo jpeg文件，而不是视频。因此Safari可能会以不同的方式处理文件类型。用一张图片试试看。例如：