1.js file
JavaScript Documentjquery.extend ({createuploadiframe:function (id, URI) {//create frame var Frameid = ' Juploadframe ' + ID; if (window. ActiveXObject) {var io = document.createelement (' <iframe id= "' + Frameid + '" name= "' + Frameid + '"/& gt; '); if (typeof uri== ' Boolean ') {io.src = ' javascript:false '; } else if (typeof uri== ' string ') {io.src = URI; }} else {var io = document.createelement (' iframe '); Io.id = Frameid; Io.name = Frameid; } io.style.position = ' absolute '; Io.style.top = ' -1000px '; Io.style.left = ' -1000px '; Document.body.appendChild (IO); return IO; }, Createuploadform:function (ID, Fileelementid, data) {//create form var formId = ' juploadform ' + ID; var fileId = ' JUPLOADFIle ' + ID; var form = jQuery (' <form action= "" method= "POST" name= "' + formId + '" id= "' + formId + '" enctype= "Multipart/form-dat A "></form>"); var oldelement = jQuery (' # ' + Fileelementid); var newelement = jQuery (oldelement). Clone (); JQuery (oldelement). attr (' id ', fileId); JQuery (Oldelement). before (newelement); JQuery (oldelement). AppendTo (form); Add support for text parameters if (data) {for (var i in data) {//alert (data[i]); $ (' <input type= ' hidden "name=" ' + i + ' "value=" ' + data[i] + ' "/> '). AppendTo (form); }}//set attributes JQuery (form). CSS (' position ', ' absolute '); JQuery (Form). CSS (' top ', ' -1200px '); JQuery (Form). CSS (' left ', ' -1200px '); JQuery (Form). AppendTo (' body '); return form; }, Ajaxfileupload:function (s) {//alert ("fuck" +s.data); TODO introduce global settings, allowing the client to modify them for all requests, not only timeout s = jque Ry.extend ({}, jquery.ajaxsettings, s); var id = s. Fileelementid; var form = Jquery.createuploadform (ID, s.fileelementid,s.data); var io = jquery.createuploadiframe (ID, S.secureuri); var Frameid = ' juploadframe ' + ID; var formId = ' juploadform ' + ID; if (S.global &&! jquery.active++) {//Watch for a new set of requests JQuery.event.trigger ("Ajaxstart"); } var requestdone = false; Create the Request object var xml = {}; if (S.global) {JQuery.event.trigger ("Ajaxsend", [XML, S]); } var uploadcallback = function (istimeout) {//Wait for a response to come back var io = document.getElementById (Frameid); try {if (Io.contentwindow) {xml.responsetext = Io.contentwindow.document.body?io.contentwindow.document . body.innerHTML:null; Xml.responsexml = io.contentWindow.document.XMLDocument?Io.contentWindow.document.XMLDocument:io.contentWindow.document; }else if (io.contentdocument) {xml.responsetext = Io.contentDocument.document.body?
Io.contentDocument.document.body.innerHTML:null; Xml.responsexml = io.contentdocument.document.xmldocument?io.contentdocument.document.xmldocument: Io.contentDocument.document; }}catch (e) {Jquery.handleerror (s, XML, NULL, E); } if (XML | | istimeout = = "Timeout") {Requestdone = true; var status; try {status = istimeout! = "Timeout"? "Success": "Error"; Make sure, the request was successful or notmodified if (Status! = "Error") { Process the data (runs the XML through Httpdata regardless of callback) var data = Jqu Ery.uploadhttpdata (XML, S.datatype); if (s.success) {//IFA local callback is specified, fire it and pass it the data S.success (data, status); }; if (S.global) {//Fire the global callback JQuery.event.trigger ("a Jaxsuccess ", [XML, S]); }; } else {Jquery.handleerror (s, XML, status); }} catch (e) {status = "error"; Jquery.handleerror (S, XML, status, E); }; if (S.global) {//The request was completed JQuery.event.trigger ("Ajaxcomplete", [XM L, S]); }; Handle the Global AJAX counter if (S.global &&!--jquery.active) { JQuery.event.trigger ("Ajaxstop"); }; 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 () { if (!requestdone) {//Check to see Ifthe request is still happening Uploadcallba CK ("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) {form.encoding = ' multipart/form-data '; } else {form.enctype = ' multipart/form-data '; } jQuery (Form). Submit (); } catch (E) {Jquery.handleerror (s, XML, NULL, E); } if (window.attachevent) {document.getElementById (Frameid). attachevent (' onload ', uploadcallback); } else{document.getElementById (Frameid). AddEventListener (' Load ', Uploadcallback, false); } return {abort:function () {}}; }, Uploadhttpdata:function (r, type) {var data =!type; data = Type = = "xml" | | Data?
R.responsexml:r.responsetext; Ifthe type is ' script ', eval it in global context if (type = = "Script") {jquery.globaleval (dat a); }//Get the JavaScript object, Ifjson is used. if (type = = "json") {eval ("data =" + data); }//Evaluate scripts within HTML if (type = = "html") {jQuery ("<div>"). HT ML (data). Evalscripts (); } return data; }});
2.struts.xml configuration:
<result name= "test" type= "JSON" > <param name= "ContentType" >text/html</param> <param Name= "Includeproperties" >param.*</param> </result>
3. How to use the front desk:
</pre><pre name= "code" class= "HTML" >
<s:file id= "File" name= "file" label= "component Info" ></s:file>
$.ajaxfileupload ( { url:url,//server-side request address Secureuri:false for file upload,// need security protocol, general set to false Fileelementid: ' file ',//upload domain ID dataType: ' json ',//return value type is generally set to JSON Data:{test1: "1", Test2: "2"},//additional references, JSON format success:function (data, status) //server Successful response handler { //alert ("Success"); }, Error:function (data, status, e)//server response failure Handler { alert (e); } } )
Ajaxfileupload method of adding parameters to an asynchronous upload attachment