ajaxfileupload.js 7.2 KB

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