2012-08-09 121 views
2

我想使用blueimp文件上傳插件來異步上傳圖片,但是當我嘗試上傳它們時,什麼也沒有發生。根本沒有任何回調函數被觸發。我正在使用此功能將文件上傳器綁定到文件輸入。blueimp jQuery文件上傳未被觸發

var initFileUpload = function (gender) { 
//Used to bind fileupload plugin and send files 

//bind file upload 
$('#add_form').fileupload({ 
    namespace: gender+'_image', 
    singleFileUploads: true, 
    formData: [{name:'gender', value: gender}], 
    fileInput: $("#"+gender+'_image'), 
    done: function(e, data){ 
     alert('success '+data.result); 
    } 

}); 
//Bind event callbacks 
$('#add_form').bind('fileuploadsend', function (e, data) { 
    console.log('sent'); 
}); 
$('#add_form').bind('fileuploaddone', function (e, data) { 
    console.log('done'); 
}); 
$('#add_form').bind('fileuploadfail', function (e, data) { 
    console.log(data.result); 
}); 
$('#add_form').bind('fileuploadalways', function (e, data) { 
    console.log(data.result); 
}); 

} 

這是由多文件上傳教程here.啓發我做這種方式,因爲我有不同的名稱,3個不同的輸入。然後我在我的ajax調用中手動發送send函數,或者嘗試。

$.ajax({ 
     type: "POST", 
     url: "/manage/processadditem", 
     data: $("#add_form").serialize(), 
     dataType: "html", 
     success: function(response, textStatus, XHR) 
     { 
     if(response.indexOf('invalid') >= 0 || response.indexOf('Exception') >= 0){ 
      //Show them their errors 
      alert(response); 
     } 
     else{ 
      //Upload item images 
      //Send files 
      $('#add_form').fileupload('send', {fileInput: $("#neutral_image"), url: '/manage/items/itemimage/test' }); 
      $('#add_form').fileupload('send', {fileInput: $("#male_image"), url: '/manage/items/itemimage/test' }); 
      $('#add_form').fileupload('send', {fileInput: $("#female_image"), url: '/manage/items/itemimage/test' }); 
      alert('should have uploaded image to cdn.completeset.com/items/test_nla.jpg if gender was neutral'); 
     } 

     }, 
     error: function(jqXHR, textStatus, errorThrown){ 
     alert('An error occurred, please try again later.'); 
     } 
    }); 

我下節的編程文件上傳,您可以使用發送方法與像$('#fileupload').fileupload('send', {files: filesList});行手動發送文件的文檔here中發現,這樣就是我試圖用發送的文件。不幸的是,我沒有得到任何回調函數的迴應,我不知道爲什麼。

+1

確保您沒有包括jQuery.js兩次。另外請記住,如果您使用的是jQuery工具,jQuery Tools有時會包含它自己的jQuery版本。 – 2012-08-09 18:19:36

+0

@KevinB這擺脫了錯誤信息,但現在它只是默默地失敗。你知道任何我可以從中獲得調試信息的方法嗎? – jaimerump 2012-08-09 18:36:19

+0

嘗試綁定到失敗事件。 '('#add_form')。on('fileuploadfail',func);'或'.bind'如果使用舊的jQuery。 – 2012-08-09 18:40:44

回答