Home  >  Article  >  Web Front-end  >  How to handle the error function after ajaxfileupload.js uploads the file

How to handle the error function after ajaxfileupload.js uploads the file

一个新手
一个新手Original
2017-09-18 10:04:391743browse

When I used ajaxfileupload.js to upload files today, I encountered a very depressing thing. No matter whether the file was uploaded successfully or not, the error callback function was always called, and the success function was never paid attention to.

The code is as follows:

//上传文件
$("#CompChange").click(function() {
  var params = $("#CompchangeTable").serialize();
  var json0={'video.slogan':$('#Cbasic_score').val(),'video.videoKind':$("#Cextra_score").val(),
		  'video.videoName':$("#name").val()};

  $.ajaxFileUpload({  
	    type: "POST",  
	    url: "adminAction-upFile.action",  
	    data:json0,//要传到后台的参数,没有可以不写  
	    secureuri : false,//是否启用安全提交,默认为false  
	    fileElementId:['file1','file2'],//文件选择框的id属性  
	    dataType: 'json',//服务器返回的格式  
	    async : false,  
	    success: function(data){  
              alert("成功");
	    },  
	    error: function (data, status, e){  
	         alert("失败");
	    }  
	});
  });

An error will be reported after uploading:


##From the error report, there may be one more "< ;"symbol. After a lot of trying, I finally found something wrong. I changed the dataType type to the context type and printed out the data in the success function.

The result is:


You find that there is a e03b848252eb9375d56be284e690e873 tag in the returned data. The problem is finally found. It turns out to be in JSON format. , but the format returned is obviously not JSon format. After checking on the Internet, I found out that sometimes the background must do something else, so I had to find other methods. Finally, I found this in the ajaxfileupload.js file:

		uploadHttpData : function(r, type) {
			var data = !type;
			data = type == "xml" || data ? r.responseXML : r.responseText;
			// If the type is "script", eval it in global context
			if (type == "script")
				jQuery.globalEval(data);
			// Get the JavaScript object, if JSON is used.
			if (type == "json"){		
				eval("data = " + data);
			}
			// evaluate scripts within html
			if (type == "html")
				jQuery("<p>").html(data).evalScripts();

			return data;
		}

This is the returned value. When returning JSON format, it directly assigns the data. This is definitely not possible, so we need to modify it:

uploadHttpData : function(r, type) {
			var data = !type;
			data = type == "xml" || data ? r.responseXML : r.responseText;
			// If the type is "script", eval it in global context
			if (type == "script")
				jQuery.globalEval(data);
			// Get the JavaScript object, if JSON is used.
			if (type == "json"){
				 ////////////以下为新增代码///////////////   
	             data = r.responseText;   
	             var start = data.indexOf(">");   
	             if(start != -1) {   
	               var end = data.indexOf("<", start + 1);   
	               if(end != -1) {   
	                 data = data.substring(start + 1, end);   
	                }   
	             }   
	              ///////////以上为新增代码/////////////// 			
				eval("data = " + data);
			}
			// evaluate scripts within html
			if (type == "html")
				jQuery("<p>").html(data).evalScripts();

			return data;
		}

We just intercept the middle one.

This is my solution, hope it will be useful to others.


The above is the detailed content of How to handle the error function after ajaxfileupload.js uploads the file. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn