如何等待多个jquery文件上传?

时间:2012-07-21 13:44:42

标签: javascript jquery

我尝试使用jquery file upload上传多个文件后刷新页面:

出于某种原因,我的测试消息在每个单独的文件上传完成后被调用,而我试图在所有文件上传后调用一次。这可能吗?

HTML:

<form id="fileupload" action="server/php/" method="POST" enctype="multipart/form-data">
    <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
    <div class="row fileupload-buttonbar">
        <div class="span7">
            <!-- The fileinput-button span is used to style the file input field as button -->
            <span class="btn btn-success fileinput-button">
                <i class="icon-plus icon-white"></i>
                <span>Add files...</span>
                <input type="file" name="files[]" multiple>
            </span>
            <button type="submit" class="btn btn-primary start">
                <i class="icon-upload icon-white"></i>
                <span>Start upload</span>
            </button>
        </div>
    </div>
    <!-- The loading indicator is shown during file processing -->
    <div class="fileupload-loading"></div>
    <br>
    <!-- The table listing the files available for upload/download -->
    <table role="presentation" class="table table-striped"><tbody class="files" data-toggle="modal-gallery" data-target="#modal-gallery"></tbody></table>
</form>

JQuery的

$('#fileupload').bind('fileuploadcompleted', function (e, data) {
    e.preventDefault();

    // I would expect to see this after all files ahve uplaoded but I see it for each file upload ?
    alert("Completed");

    //location.reload();
    ...
})

2 个答案:

答案 0 :(得分:0)

监听fileuploadadd事件,每次发生时都会增加一些变量,以便您知道要上传的文件数量。然后,在fileuploaddone事件处理程序中,增加另一个变量,以便知道完成了多少个变量。当两者相等时,所有上传都完成了,所以你的重新加载(或者你可能需要做的任何事情)。似乎应该是一个更好的解决方案,但是这个应该可行。

答案 1 :(得分:0)

stop事件仅在所有上传完成后触发。

$('#fileupload').bind('fileuploadstop', function (e, data) {
    location.reload();
})