0

重複の可能性：
jQueryを使用して、アップロードする前にファイルサイズを制限する

サーバーにファイルをアップロードする前にファイルサイズとファイルタイプを確認できる優れたjqueryスクリプトまたはその他の方法はありますか？私はあちこち見てみましたが、このようなことをするものは見つかりませんでした。

4

3 に答える 3

3

ここからの抜粋：ファイルを非同期でアップロードするにはどうすればよいですか？

古いブラウザ（IE6 / 7（ええと、まだそれらを使用している人）など）で動作するかどうかはわかりませんが、試してみてください。ただし、最近のすべてのブラウザで動作するはずです。それを試してみてください：

<form enctype="multipart/form-data">
<input name="file" type="file" />
<input type="submit" value="Upload" />
</form>
$(':file').change(function(){
    var file = this.files[0];
    name = file.name;
    size = file.size;
    type = file.type;
    //your validation
});
于 2012-09-23T14:54:46.043 に答える
3

私は次のことを提案します：

$('input:file').change(
    function(e) {
        var files = e.originalEvent.target.files;
        for (var i=0, len=files.length; i<len; i++){
            console.log(files[i].fileName, files[i].type, files[i].fileSize);
        }
    });​

JSフィドルデモ。

JavaScriptは選択したfileListオブジェクトからファイルを削除できないため、ファイル属性に対してチェックを実行し、ファイルタイプまたはファイルサイズが原因で無効と見なされるファイルの選択を解除するようにユーザーに促す必要があります（そして、明らかに、フォーム送信）：

$('input:file').change(
    function(e) {
        var files = e.originalEvent.target.files;
        for (var i=0, len=files.length; i<len; i++){
            var n = files[i].name,
                s = files[i].size,
                t = files[i].type;

            if (s > 100) {
                console.log('Please deselect this file: "' + n + '," it\'s larger than the maximum filesize allowed. Sorry!');
            }
        }
    });​

JSフィドルデモ。

（この最後のコードは、Ubuntu11.04のChromium19とFirefox15でテストされ、動作しています。）

于 2012-09-23T14:56:08.053 に答える
1

jQuery File Uploadプラグインがあり、車輪の再発明をする必要はありません。acceptFileTypes特定のファイルタイプに一致する正規表現を提供できるオプションと、次のようなオプションがありますmaxFileSize。

{
  fileTypes: /^(gif|jpeg|png)$/,
  maxFileSize: 20000000 // 20MB
}

ただし、これはFileAPIをサポートするWebブラウザでのみ機能することに注意してください。それ以外の場合は、サーバー側でファイルの種類を確認する必要があります。

于 2012-09-23T14:56:14.353 に答える