使用ajaxfileupload.js
页面中如此调用:
javascript:
function uploadImg(){
$.ajaxFileUpload({
url : 'uploadFile.action',secureuri : false,fileElementId : 'file',dataType : 'json',success : function(data,status) {
},error : function(data,status,e) {
alert(e);
}
});
}
html:
图片:<input type="file" name="file" id="file" class="required imgFile" size="30" />
<input type="button" value="上传" onclick="uploadImg();"/>
需要注意的是,ajaxfileupload.js已经好久没更新了,所以在新版jquery中需要对ajaxfileupload.js做如下更改:
新增两个方法(放到jQuery.extend里):
handleError: function (s,xhr,e) {
if (s.error) {
s.error.call(s.context || s,e);
}
if (s.global) {
(s.context ? jQuery(s.context) : jQuery.event).trigger("ajaxError",[xhr,s,e]);
}
},httpData: function (xhr,type,s) {
var ct = xhr.getResponseHeader("content-type"),xml = type == "xml" || !type && ct && ct.indexOf("xml") >= 0,data = xml ? xhr.responseXML : xhr.responseText;
if (xml && data.documentElement.tagName == "parsererror")
throw "parsererror";
if (s && s.dataFilter)
data = s.dataFilter(data,type);
if (typeof data === "string") {
if (type == "script")
jQuery.globalEval(data);
if (type == "json")
data = window["eval"]("(" + data + ")");
}
return data;
},
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("<div>").html(data).evalScripts();
//alert($('param',data).each(function(){alert($(this).attr('value'));}));
return data;
}
本文引用了互联网上大量的资料,然后自我整理后完成,感谢大家。