1

我正面临一个非常奇怪的问题。我正在使用 swfupload 将多个图像上传到 ImageShack 服务器。我还将返回的 URL 存储在数据库中。如何在收到 ImageShack 返回的 URL 后立即显示给用户?上传完成后,有什么方法可以让 swfupload 返回 URL?这是我用于上传图片的代码:

$('#swfupload-control').swfupload({  
    upload_url: "<%= upload_url-%>",  
    file_post_name: 'photo',  
    post_params: {"authenticity_token" : "<%= form_authenticity_token %>"},
    file_size_limit : "100024",  
    file_types : "*.jpg;*.png;*.gif",  
    file_types_description : "Image files",  
    file_upload_limit : 5,  
    flash_url : "/flash/swfupload.swf",  
    button_image_url : '/javascripts/swfupload/XPButtonUploadText_61x22.png',  
    button_width : 62,  
    button_height : 22,  
    button_placeholder : $('#button')[0],  
    debug: false  
})  
.bind('fileQueued', function(event, file){  
    var listitem='<li id="'+file.id+'" >'+  
        'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+  
        '<div class="progressbar" ><div class="progress" ></div></div>'+  
        '<p class="status" >Pending</p>'+  
        '<span class="cancel" >&nbsp;</span>'+  
        '</li>';  
    $('#log').append(listitem);  
    $('li#'+file.id+' .cancel').bind('click', function(){
        //Remove from queue on cancel click  
        var swfu = $.swfupload.getInstance('#swfupload-control');  
        swfu.cancelUpload(file.id);  
        $('li#'+file.id).slideUp('fast');  
    });  
    // start the upload since it's queued  
    $(this).swfupload('startUpload'); 
}) 
.bind('fileQueueError', function(event, file, errorCode, message){ 
    alert('Size of the file '+file.name+' is greater than limit'); 
}) 
.bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){ 
    $('#queuestatus').text('Files Selected: '+numFilesSelected+' / Queued Files: '+numFilesQueued); 
}) 
.bind('uploadStart', function(event, file){ 
    $('#log li#'+file.id).find('p.status').text('Uploading...'); 
    $('#log li#'+file.id).find('span.progressvalue').text('0%'); 
    $('#log li#'+file.id).find('span.cancel').hide(); 
}) 
.bind('uploadProgress', function(event, file, bytesLoaded){ 
    //Show Progress 
    var percentage=Math.round((bytesLoaded/file.size)*100); 
    $('#log li#'+file.id).find('div.progress').css('width', percentage+'%'); 
    $('#log li#'+file.id).find('span.progressvalue').text(percentage+'%');
}) 
.bind('uploadSuccess', function(event, file, serverData){ 
    var item=$('#log li#'+file.id), fetchedfile;  
    item.find('div.progress').css('width', '100%'); 
    item.find('span.progressvalue').text('100%'); 

    var pathtofile='<a href="'+fetchedfile+'" target="_blank" >view &raquo;</a>'; 
    item.addClass('success').find('p.status').html('Done!!! | '+pathtofile); 
}) 
.bind('uploadComplete', function(event, file){ 
    // upload has completed, try the next one in the queue 
      
    $(this).swfupload('startUpload');  
});

swfupload 文档中没有内置回调函数用于获取上传的图像文件的 URL。

4

1 回答 1

3

哦,这很简单。uploadSuccess回报serverData

.bind('uploadSuccess', function(event, file, serverData){ 
    var item=$('#log li#'+file.id), fetchedfile;  
    item.find('div.progress').css('width', '100%'); 
    item.find('span.progressvalue').text('100%'); 
    fetchedfile = serverData;
    var pathtofile='<a href="'+fetchedfile+'" target="_blank" >view &raquo;</a>'; 
    item.addClass('success').find('p.status').html('Done!!! | '+pathtofile); 
}) 
于 2010-07-21T04:42:43.847 回答