使用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, status, e) {
if (s.error) {
s.error.call(s.context || s, xhr, status, 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;
}
本文引用了互联网上大量的资料,然后自我整理后完成,感谢大家。