思路是:
前台界面有选择文件的控件和上传按钮-->上传按钮调用js方法(js判断是否允许上传)-->js调用ashx中的方法实现文件上传参考代码如下:
1、asp页面添加文件选择控件(mini-htmlfile属于miniUI框架的一种,也可以选择其他框架)
<input class="mini-htmlfile" id="D_PIC" name="D_PIC" style="width: 150px; display: block; float: left;" />
<a class="mini-button" style="display: block; float: left; margin-left: 25px;" iconcls="icon-save" plain="true" οnclick="ajaxFileUpload()">上传</a>
2、js代码 (需引用ajaxfileupload.js 百度即可)
function ajaxFileUpload() {
var inputFile = $("#D_PIC > input:file")[0];
var filename = inputFile.value;
if (filename == "" || filename == null) {
mini.alert("您没有选择文件,无需上传");
return;
}
var hz = filename.split(".");
var last = hz[hz.length - 1];
var tp = "txt,TXT,docx,DOCX,doc,DOC,XLS,xls,pdf,PDF,XLSX,xlsx,jpg,gif,bmp,JPG,GIF,BMP,JPEG、PNG,png,jpge,zip,rar";
var rs = tp.indexOf(last);
if (rs < 0) {
mini.alert("不允许上传的文件类型!");
return;
}
//alert(filename);
$.ajaxFileUpload({
url: '../ashx/AllQuery.ashx?type=upLoad', //用于文件上传的服务器端请求地址
fileElementId: inputFile, //文件上传域的ID
data: { filename: filename }, //附加的额外参数
dataType: 'text', //返回值类型 一般设置为json
success: function (data) //服务器成功响应处理函数
{
mini.alert("上传成功,请确认问题并提交");
//alert(data.split('>')[1].split('<')[0]);
mini.get("D_PIC").setText(data.split('>')[1].split('<')[0]);
},
error: function (data, status, e) //服务器响应失败处理函数
{
alert(e);
},
complete: function () {
// var jq = $("#file1 > input:file");
// jq.before(inputFile);
// jq.remove();
}
});
}
3、ashx代码(为了避免文件名重复,本方法将文件名改了)
public string upLoad(HttpContext context)
{
string InputFile = context.Request["filename"].ToString();
string uploadName = InputFile;
string fileName = "";
if (InputFile != "")
{
int idx = uploadName.LastIndexOf(".");
string suffix = uploadName.Substring(idx);
fileName = DateTime.Now.Ticks.ToString() + suffix;
}
try
{
if (uploadName != "")
{
HttpFileCollection MyFileCollection = context.Request.Files;
string path = context.Server.MapPath("~/Filepath/");
MyFileCollection[0].SaveAs(path + fileName);
}
}
catch (Exception ex)
{
// Response.Write(ex);
}
return fileName;
}