Question

Safari mobile <input type="file">会忽略传入的大型文件（目前使用a 10mb image file进行测试）。

当它这样做时，输入不会触发任何事件（没有变化，没有错误，没有任何事件）。它只是忽略了用户操作。

无论如何都要检测何时发生这种情况才能通知我们的用户？

编辑：因为这看起来真的像 Safari，但是，我在Safari bug跟踪器上打开了问题＃16862230（我留下了一个链接，但没有...哦Apple ...）如果你可以重现，请对这个问题发表评论！ / p>

Answer 1

我在iFadey上发现了一篇关于计算上传文件大小的文章：http://www.ifadey.com/2012/05/get-file-size-from-input-control/

这是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上传13 MB视频。它是自动压缩的，但脚本仍然返回实际的文件大小。

看看这里：http://jsbin.com/kubodoqe/3/edit

尝试一下，让我知道它是否有效。

编辑：如果要将上传文件的最大大小设置为10 MB，请将其添加到代码中：

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

更新了JS Bin：http://jsbin.com/kubodoqe/5/edit

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

1 个答案: