The ajax file is uploaded successfully to solve the browser compatibility problem. The ajax file is uploaded.

The ajax file is uploaded successfully to solve the browser compatibility problem. The ajax file is uploaded.

The ajaxfileupload control is very easy to use, but it is found that the result of the uploaded file is processed by the browser, IE will not, Gu Ge and Firefox will process the results, and Gu Ge and Firefox will not process the results after processing, the compatibility of the above three browsers is adjusted here.

JQuery. extend ({createUploadIframe: function (id, uri) {// create frame var frameId = 'juploadframe '+ id; var iframeHtml = '<iframe id = "' + frameId + '" name = "' + frameId + '" style = "position: absolute; top:-9999px; left: -9999px "'; if (window. activeXObject) {if (typeof uri = 'boolean') {iframeHtml + = 'src = "'+ 'javascript: false' + '"';} else if (typeof uri = 'string') {iframeHtml + = 'src = "'+ uri + '"' ;}} IframeHtml + = '/>'; jQuery (iframeHtml ). appendTo (document. body); return jQuery ('#' + frameId ). get (0) ;}, createUploadForm: function (id, fileElementId, data, fileElement) {// create form var formId = 'juploadform' + id; var fileId = 'juploadfile' + id; var form = jQuery ('<form action = "" method = "POST" name = "' + formId + '" id = "' + formId + '" enctype = "multipart/ form-data "> </form> '); if (data) {For (var I in data) {jQuery ('<input type = "hidden" name = "' + I + '" value = "' + data [I] + '"/> '). appendTo (form) ;}}var oldElement; if (fileElement = null) oldElement = jQuery ('#' + fileElementId); else oldElement = fileElement; var newElement = jQuery (oldElement ). clone (); jQuery (oldElement ). attr ('id', fileId); jQuery (oldElement ). before (newElement); jQuery (oldElement ). appendTo (form); // set attri Butes jQuery(form).css ('position', 'absolute '); jQuery(form).css ('top','-0000p'); jQuery(form).css ('left', '-0000p '); jQuery (form ). appendTo ('body'); return form;}, ajaxFileUpload: function (s) {// TODO introduce global settings, allowing the client to modify them for all requests, not only timeout s = jQuery. extend ({}, jQuery. ajaxSettings, s); var id = new Date (). getTime () var form = jQuery. cr EateUploadForm (id, s. fileElementId, (typeof (s. data) = 'undefined '? False: s. data), s. fileElement); var io = jQuery. createUploadIframe (id, s. secureuri); var frameId = 'juploadframe '+ id; var formId = 'juploadform' + id; // Watch for a new set of requests if (s. global &&! JQuery. active ++) {jQuery. event. trigger ("ajaxStart");} var requestDone = false; // Create the request object var xml ={} if (s. global) jQuery. event. trigger ("ajaxSend", [xml, s]); // Wait for a response to come back var uploadCallback = function (isTimeout) {var io = document. getElementById (frameId); try {if (io. contentWindow) {xml. responseText = io.content+doc ument. body? Io.contentdomaindoc ument. body. innerHTML: null; xml. responseXML = io.content+doc ument. XMLDocument? Io.contentcontactdoc ument. XMLDocument: io.contentcontactdoc ument;} else if (io. contentDocument) {xml. responseText = io.contentDocument.doc ument. body? Io.contentDocument.doc ument. body. innerHTML: null; xml. responseXML = io.contentDocument.doc ument. XMLDocument? Io.contentDocument.doc ument. XMLDocument: io.contentDocument.doc ument;} catch (e) {jQuery. handleError (s, xml, null, e);} if (xml | isTimeout = "timeout") {requestDone = true; var status; try {status = isTimeout! = "Timeout "? "Success": "error"; // Make sure that the request was successful or notmodified if (status! = "Error") {// process the data (runs the xml through httpData regardless of callback) console. log (jQuery. uploadHttpData); var data = jQuery. uploadHttpData (xml, s. dataType); // If a local callback was specified, fire it and pass it the data if (s. success) s. success (data, status); // Fire the global callback if (s. global) jQuery. event. trigger ("ajaxSuccess", [xml, s]);} else jQuery. handleE Rror (s, xml, status);} catch (e) {status = "error"; jQuery. handleError (s, xml, status, e);} // The request was completed if (s. global) jQuery. event. trigger ("ajaxComplete", [xml, s]); // Handle the global AJAX counter if (s. global &&! -- JQuery. active) jQuery. event. trigger ("ajaxStop"); // Process result if (s. complete) s. complete (xml, status); jQuery (io ). unbind () setTimeout (function () {try {jQuery (io ). remove (); jQuery (form ). remove ();} catch (e) {jQuery. handleError (s, xml, null, e) ;}, 100) xml = null }// Timeout checker if (s. timeout> 0) {setTimeout (function () {// Check to see if the request is still happening I F (! RequestDone) uploadCallback ("timeout") ;}, s. timeout);} try {var form = jQuery ('#' + formId); jQuery (form ). attr ('action', s. url); jQuery (form ). attr ('method', 'post'); jQuery (form ). attr ('target', frameId); if (form. encoding) {jQuery (form ). attr ('encoding', 'multipart/form-data');} else {jQuery (form ). attr ('enablesype ', 'multipart/form-data');} jQuery (form ). submit ();} catch (e) {jQuery. handleErro R (s, xml, null, e);} jQuery ('#' + frameId ). load (uploadCallback); return {abort: function () {try {jQuery ('#' + frameId ). remove (); jQuery (form ). remove () ;}catch (e) {}}}, uploadHttpData: function (r, type) {var data = ""; data = (type = "xml "? R. responseXML: r. responseText); if (type = "script") jQuery. globalEval (data);/*** auth garen 2016-06-17 * processes the response results after the file is uploaded, and supports ie ff gc **/if (type = "json ") {var reg = ""; if (data. indexOf ("<pre>")>-1) {reg =/<pre> (. +) <\/pre>/g;} else {reg =/<pre. +?> (. +) <\/Pre>/g;} var result = data. match (reg); var stri1 = RegExp. $1; if (stri1! = Null & stri1! = "" & Stri1.trim (). length> 0) {data = stri1;} eval ("data =" + data);} if (type = "html ") jQuery ("<div>" ).html (data ). evalScripts (); return data;}, handleError: function (s, xml, status, e) {// If a local callback was specified, fire it if (s. error) s. error (xml, status, e); // Fire the global callback if (s. global) jQuery. event. trigger ("ajaxError", [xml, s, e]) ;}});

The above is all the content of this article, hoping to help you learn.