jquery.ajaxfileupload.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239
  1. jQuery.extend({
  2. createUploadIframe: function(id, uri)
  3. {
  4. //create frame
  5. var frameId = 'jUploadFrame' + id;
  6. if(window.ActiveXObject) {
  7. if(jQuery.browser.version=="9.0" || jQuery.browser.version=="10.0"){
  8. var io = document.createElement('iframe');
  9. io.id = frameId;
  10. io.name = frameId;
  11. }else if(jQuery.browser.version=="6.0" || jQuery.browser.version=="7.0" || jQuery.browser.version=="8.0"){
  12. var io = document.createElement('<iframe id="' + frameId + '" name="' + frameId + '" />');
  13. if(typeof uri== 'boolean'){
  14. io.src = 'javascript:false';
  15. }
  16. else if(typeof uri== 'string'){
  17. io.src = uri;
  18. }
  19. }
  20. }
  21. else {
  22. var io = document.createElement('iframe');
  23. io.id = frameId;
  24. io.name = frameId;
  25. }
  26. io.style.position = 'absolute';
  27. io.style.top = '-1000px';
  28. io.style.left = '-1000px';
  29. document.body.appendChild(io);
  30. return io
  31. },
  32. createUploadForm: function(id, fileElementId,data)
  33. {
  34. //create form
  35. var formId = 'jUploadForm' + id;
  36. var fileId = 'jUploadFile' + id;
  37. var form = $('<form action="" method="POST" name="' + formId + '" id="' + formId + '" enctype="multipart/form-data"></form>');
  38. if(typeof(fileElementId) == "string"){
  39. var oldElement = $('#' + fileElementId);
  40. var newElement = $(oldElement).clone(true);/*此部分解决只能上传一次的问题*/
  41. $(oldElement).attr('id', fileId);
  42. $(oldElement).before(newElement);
  43. $(oldElement).appendTo(form);
  44. }else{
  45. for(var i in fileElementId){
  46. var oldElement = $('#' + fileElementId[i]);
  47. var newElement = $(oldElement).clone();
  48. $(oldElement).attr('id', fileId);
  49. $(oldElement).before(newElement);
  50. $(oldElement).appendTo(form);
  51. }
  52. }
  53. //set attributes
  54. if (data) {
  55. for ( var i in data) {
  56. $('<input type="hidden" name="' + i + '" value="' + data[i] + '" />').appendTo(form);
  57. }
  58. }
  59. $(form).css('position', 'absolute');
  60. $(form).css('top', '-1200px');
  61. $(form).css('left', '-1200px');
  62. $(form).appendTo('body');
  63. return form;
  64. },
  65. ajaxFileUpload: function(s) {
  66. // TODO introduce global settings, allowing the client to modify them for all requests, not only timeout
  67. s = jQuery.extend({}, jQuery.ajaxSettings, s);
  68. var id = new Date().getTime()
  69. var form = jQuery.createUploadForm(id, s.fileElementId,s.data);
  70. var io = jQuery.createUploadIframe(id, s.secureuri);
  71. var frameId = 'jUploadFrame' + id;
  72. var formId = 'jUploadForm' + id;
  73. // Watch for a new set of requests
  74. if ( s.global && ! jQuery.active++ )
  75. {
  76. jQuery.event.trigger( "ajaxStart" );
  77. }
  78. var requestDone = false;
  79. // Create the request object
  80. var xml = {}
  81. if ( s.global )
  82. jQuery.event.trigger("ajaxSend", [xml, s]);
  83. // Wait for a response to come back
  84. var uploadCallback = function(isTimeout)
  85. {
  86. var io = document.getElementById(frameId);
  87. try
  88. {
  89. if(io.contentWindow)
  90. {
  91. xml.responseText = io.contentWindow.document.body?io.contentWindow.document.body.innerHTML:null;
  92. xml.responseXML = io.contentWindow.document.XMLDocument?io.contentWindow.document.XMLDocument:io.contentWindow.document;
  93. }else if(io.contentDocument)
  94. {
  95. xml.responseText = io.contentDocument.document.body?io.contentDocument.document.body.innerHTML:null;
  96. xml.responseXML = io.contentDocument.document.XMLDocument?io.contentDocument.document.XMLDocument:io.contentDocument.document;
  97. }
  98. }catch(e)
  99. {
  100. jQuery.handleError(s, xml, null, e);
  101. }
  102. if ( xml || isTimeout == "timeout")
  103. {
  104. requestDone = true;
  105. var status;
  106. try {
  107. status = isTimeout != "timeout" ? "success" : "error";
  108. // Make sure that the request was successful or notmodified
  109. if ( status != "error" )
  110. {
  111. // process the data (runs the xml through httpData regardless of callback)
  112. var data = jQuery.uploadHttpData( xml, s.dataType );
  113. // If a local callback was specified, fire it and pass it the data
  114. if ( s.success )
  115. s.success( data, status );
  116. // Fire the global callback
  117. if( s.global )
  118. jQuery.event.trigger( "ajaxSuccess", [xml, s] );
  119. } else
  120. jQuery.handleError(s, xml, status);
  121. } catch(e)
  122. {
  123. status = "error";
  124. jQuery.handleError(s, xml, status, e);
  125. }
  126. // The request was completed
  127. if( s.global )
  128. jQuery.event.trigger( "ajaxComplete", [xml, s] );
  129. // Handle the global AJAX counter
  130. if ( s.global && ! --jQuery.active )
  131. jQuery.event.trigger( "ajaxStop" );
  132. // Process result
  133. if ( s.complete )
  134. s.complete(xml, status);
  135. jQuery(io).unbind()
  136. setTimeout(function()
  137. { try
  138. {
  139. $(io).remove();
  140. $(form).remove();
  141. } catch(e)
  142. {
  143. jQuery.handleError(s, xml, null, e);
  144. }
  145. }, 100)
  146. xml = null
  147. }
  148. }
  149. // Timeout checker
  150. if ( s.timeout > 0 )
  151. {
  152. setTimeout(function(){
  153. // Check to see if the request is still happening
  154. if( !requestDone ) uploadCallback( "timeout" );
  155. }, s.timeout);
  156. }
  157. try
  158. {
  159. // var io = $('#' + frameId);
  160. var form = $('#' + formId);
  161. $(form).attr('action', s.url);
  162. $(form).attr('method', 'POST');
  163. $(form).attr('target', frameId);
  164. if(form.encoding)
  165. {
  166. form.encoding = 'multipart/form-data';
  167. }
  168. else
  169. {
  170. form.enctype = 'multipart/form-data';
  171. }
  172. $(form).submit();
  173. } catch(e)
  174. {
  175. jQuery.handleError(s, xml, null, e);
  176. }
  177. if(window.attachEvent){
  178. document.getElementById(frameId).attachEvent('onload', uploadCallback);
  179. }
  180. else{
  181. document.getElementById(frameId).addEventListener('load', uploadCallback, false);
  182. }
  183. return {abort: function () {}};
  184. },
  185. uploadHttpData: function( r, type ) {
  186. var data = !type;
  187. data = type == "xml" || data ? r.responseXML : r.responseText;
  188. // If the type is "script", eval it in global context
  189. if ( type == "script" )
  190. jQuery.globalEval( data );
  191. // Get the JavaScript object, if JSON is used.
  192. if ( type == "json" ){
  193. ////////////以下为新增代码///////////////
  194. data = r.responseText;
  195. var start = data.indexOf(">");
  196. if(start != -1) {
  197. var end = data.indexOf("<", start + 1);
  198. if(end != -1) {
  199. data = data.substring(start + 1, end);
  200. }
  201. }
  202. ///////////以上为新增代码///////////////
  203. eval( "data = " + data );
  204. // evaluate scripts within html
  205. }
  206. return data;
  207. },
  208. handleError: function( s, xhr, status, e ) {
  209. // If a local callback was specified, fire it
  210. if ( s.error ) {
  211. s.error.call( s.context || s, xhr, status, e );
  212. }
  213. // Fire the global callback
  214. if ( s.global ) {
  215. (s.context ? jQuery(s.context) : jQuery.event).trigger( "ajaxError", [xhr, s, e] );
  216. }
  217. }
  218. })