詳解Thinkphp結合ajaxFileUpload實現非同步圖片傳輸範例程式碼

這篇文章主要給大家介紹了利用Thinkphp結合ajaxFileUpload實現非同步圖片傳輸的方法，文中給出了詳細的範例程式碼，對大傢具有一定的參考價值，需要的朋友們下面來一起看看吧。

前言

在做這個項目之前，對圖片上傳處理一直都是直接用表單提交的方式進行檔案傳輸，這次因為需求，需要實現對圖片進行非同步傳輸，雖然實現並不難，畢竟現在外掛程式太多了，但還是浪費了我很長的調試時間，原因便是使用了遠古時期的外掛程式ajaxfileupload，在剛開始使用的時候頻繁報錯，說handler is not a function。

懷著沉重的心情，我百度了一下，然後就找到了答案，不禁感概搜尋引擎真是強大。

解決方案

上述報錯的原因便是jquery從1.9.0開始便不再使用handler這個方法了，具體原因未知，所以只能在下載下來的 jQuery.extend({ 裏手動添加代碼：

handleError: function( s, xhr, status, e ){// If a local callback was specified, fire itif ( s.error ) {s.error.call( s.context || s, xhr, status, e );}// Fire the global callbackif ( s.global ) {(s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError", [xhr, s, e] );}}

，繼續debug

$.ajaxfileupload({　　url : '',　　secureuri : '',　　fileElementId : '', --> 這裡填的是 input file的ID　　data : {},　　dataType : 'json',　　complete : function(data){}　})

代碼不在報錯了，但又有新的問題，返回的資料一直是undefined，隨後看了下調試工具，傳回值存在，而且格式也沒問題，怎麼都想不明白之後，又去..................百度了,

然後做了兩個調整：

1，將ajaxfileupload.js裡的 eval('data = '+ data) ; 替換成 data = jQuery.parseJSON(jQuery(data).text());

2，將complete方法換成success

ok，後端返回的資料可以列印了。

總結