6

我一直在浏览一些“类似”的问题,但没有一个可以解决我遇到的特定问题。

我正在使用 Plupload (http://www.plupload.com) 将图像上传到 Amazon S3。这很好用,但是一旦上传完成,我想更新页面上的另一个 div 以显示上传文件的缩略图。我的意图是使用 jQuery.load 来执行此操作(因为我需要先运行数据库查询才能输出它们)。但是,现在我正在尝试使基础知识正常工作并简单地用文本更新 div。

我当前的代码(如下)没有返回任何错误,但是一旦上传了文件,它就不会更新 div。查看各种答案/建议,似乎有多种方法可以实现我正在寻找的东西 - 但我无法得到任何工作。

这是我现在的代码...

<script>
$(document).ready(function(upload) {
$("#uploader").pluploadQueue({
    runtimes : 'html5,html4',
    url : '/gallery/upload.cfm',
    max_file_size : '5000kb',
    multiple_queues : true,
    unique_names : true,
    filters : [
        {title : "Image files", extensions : "jpg,gif,png,jpeg"}
    ]
});
$("#uploader").bind('FileUploaded', function() {
$(".outputimages").html('The output goes here');
});
});
</script>

<div id="uploader">You browser doesn't have HTML 4 support.</div> 

<div class="outputimages"></div>
4

2 回答 2

8

这是我的代码,它在我身边工作:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="plupload/jquery.plupload.queue.js"></script>
<script src="plupload/plupload.full.js"></script>
<script>
    $(function() {
        $("#uploader").pluploadQueue({
            runtimes : 'html5,html4',
            max_file_size : '10mb',
            url : 'upload.php',
            max_file_size : '5000kb',
            multiple_queues : true,
            unique_names : true,
            filters : [
                {title : "Image files", extensions : "jpg,gif,png,jpeg"}
            ]
        });

        var uploader = $('#uploader').pluploadQueue();

        uploader.bind('FileUploaded', function() {
            if (uploader.files.length == (uploader.total.uploaded + uploader.total.failed)) {
                $(".outputimages").html('The output goes here');
            }
        });
    });
</script>

<div id="uploader">You browser doesn't have HTML 4 support.</div> 

<div class="outputimages"></div>

这个例子,在队列中的每个文件都被上传后触发 FileUploaded 函数。

于 2012-09-26T19:52:20.053 回答
7

使用 UploadComplete 而不是 FileUploaded 效果更好

于 2013-02-18T21:09:43.090 回答