jquery与ajax实现上传文件并显示.doc
文本预览下载声明
Ajax实现上传文件
★在Visual Studio 2005 中,新建网站 命名为TestAjaxUpload,如图:
在网站上添加两个新建文件夹js和Temp文件
js文件夹下添加两个文件ajaxfileupload.js和jquery-1.7.1.min.js
★其中jquery-1.7.1.min.js的下载地址可以来自:
73/4/js?ssig=yaQs%2FkaDmcExpires=1384099200KID=sina,isharefn=jquery-1.7.min.js
★其中ajaxfileupload.js的代码如下:
jQuery.extend({
createUploadIframe: function (id, uri) {
//创建 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) {
//创建 frame
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 = jQuery(# + fileElementId);
var newElement = jQuery(oldElement).clone();
jQuery(oldElement).attr(id, fileId);
jQuery(oldElement).before(newElement);
jQuery(oldElement).appendTo(form);
//设置属性
jQuery(form).css(position, absolute);
jQuery(form).css(top, -1200px);
jQuery(form).css(left, -1200px);
jQuery(form).appendTo(body);
return form;
},
ajaxFileUpload: function (s) {
s = jQuery.extend({}, jQuery.ajaxSettings, s);
var id = new Date().getTime()
var form = jQuery.createUploadForm(id, s.f
显示全部