1

jquery file uploadを使用して複数の画像をアップロードした後、アップロード ページを更新しようとしています。

現在、追加されたファイルの数を数えており、それらが成功したアップロードの数と一致する場合は、ページを更新します。これは、ユーザーが無効なファイル タイプまたは小さすぎる画像をアップロードしようとするまでうまく機能します。これらの失敗を合計数に含めるにはどうすればよいですか? これを行うための好ましい方法はありますか？

    $('#fileupload').fileupload({
        acceptFileTypes: /(\.|\/)(jpe?g|png)$/i
    });

    var filesqueued = null; 
    var filesuploaded = 0;

    $('#fileupload').bind('fileuploadadd', function (e, data) {
        filesqueued = data.originalFiles.length;
    });


    $('#fileupload').bind('fileuploaddone', function (e, data) {
        filesuploaded = filesuploaded + 1;

        if (filesuploaded == filesqueued) {
            filesuploaded = 0;
            location.reload();
        }
    })
4

1 に答える 1

3

jQuery ファイル アップロードの組み込みイベントを使用して、成功イベントと失敗イベントをバインドできます。

$('#fileupload').bind('fileuploadcompleted', function (e, data) {
    /* Successful upload */
        filesuploaded = filesuploaded + 1;
});

$('#fileupload').bind('fileuploadfailed', function (e, data) {
    /* Failed upload */
    // [...]
});

ドキュメントの詳細: https://github.com/blueimp/jQuery-File-Upload/wiki/Options

または、サーバー側ですべてを行うこともできます。アップロード ハンドラー (jQuery ファイル アップロードのurlオプション) を応答させます。

<?php
if ( $valid == false ) {
    echo 'invalid';
    // or echo( json_encode( array( 'result' => 'invalid' ) ) );
}

次に jQuery に戻り、返されたデータを分析します。

$('#fileupload').bind('fileuploaddone', function (e, data) {
    /* Check returned data */
    // Could use JSON or simple text output
    // if ( data.result == 'invalid' ) {
    if ( data == 'invalid' ) {
        // file did not pass
    } else {
        // file uploaded fine
        filesuploaded = filesuploaded + 1;
    }

    if (filesuploaded == filesqueued) {
        filesuploaded = 0;
        location.reload();
    }
})
于 2012-07-23T00:28:55.610 に答える