Uploadify是JQuery的一个上传插件，实现的效果非常不错，带进度显示。不过官方提供的实例时php版本的，本文将详细介绍Uploadify在Aspnet中的使用，您也可以点击下面的链接进行演示或下载。
首先按下面的步骤来实现一个简单的上传功能。
1 创建Web项目，命名为JQueryUploadDemo，从官网上下载最新的版本解压后添加到项目中。
2 在项目中添加UploadHandler.ashx文件用来处理文件的上传。
3 在项目中添加UploadFile文件夹，用来存放上传的文件。
进行完上面三步后项目的基本结构如下图:
4 Default.aspx的html页的代码修改如下：
<html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">
<title>Uploadify</title>
<link href="JS/jquery.uploadify-v2.1.0/example/css/default.css"
rel="stylesheet" type="text/css" />
<link href="JS/jquery.uploadify-v2.1.0/uploadify.css"
rel="stylesheet" type="text/css" />
<script type="text/javascript"
src="JS/jquery.uploadify-v2.1.0/jquery-1.3.2.min.js"></script>
<script type="text/javascript"
src="JS/jquery.uploadify-v2.1.0/swfobject.js"></script>
<script type="text/javascript"
src="JS/jquery.uploadify-v2.1.0/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#uploadify").uploadify({
'uploader': 'JS/jquery.uploadify-v2.1.0/uploadify.swf',
'script': 'UploadHandler.ashx',
'cancelImg': 'JS/jquery.uploadify-v2.1.0/cancel.png',
'folder': 'UploadFile',
'queueID': 'fileQueue',
'auto': false,
'multi': true
})
})
</script>
</head>
<body>
<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<a href="javascript:$('#uploadify').uploadifyUpload()">上传</a>|
<a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上传</a>
</p>
</body>
</html>
5 UploadHandler类的ProcessRequest方法代码如下：
public void ProcessRequest(HttpContext context){
context.Response.ContentType = "text/plain"
context.Response.Charset = "utf-8"
HttpPostedFile file = context.Request.Files["Filedata"]
string uploadPath =
HttpContext.Current.Server.MapPath(@context.Request["folder"])+"\\"
if (file != null)
{
if (!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath)
}
file.SaveAs(uploadPath + file.FileName)
//下面这句代码缺少的话，上传成功后上传队列的显示不会自动消失
context.Response.Write("1")
}
else
{
context.Response.Write("0")
}
}
6 运行后效果如下图：
在Jsp页面中编写Script代码实现上传事件的描述，必须要注意其中的路径问题，uploader（springmvc controller处理的位置），其他两个路径为uploadify文件的存放路径（这个可以到官网下载）uploadify下载下来的文件的存放路径
在Jsp页面中编写页面的具体布置
实现页面如下
在controller目录中创建类对jsp页面中的请求进行处理，由于代码比较多，所以截图分两部分，最后面给出具体的代码文字
/**
* 处理文件上传
* @param response
* @param request
* @return
* @throws IOException
*/
@RequestMapping(value="/uploadFile",method=RequestMethod.POST)
public String upload(HttpServletResponse response,HttpServletRequest request) throws IOException{
String responseStr=""
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request
Map<String, MultipartFile>fileMap = multipartRequest.getFileMap()
//String savePath = this.getServletConfig().getServletContext().getRealPath("")
//savePath = savePath + "/uploads/"
// 文件保存路径 ctxPath本地路径
String ctxPath=request.getSession().getServletContext().getRealPath("/")+File.separator+"uploadFiles"
SimpleDateFormat sdf = new SimpleDateFormat("yyyyMM")
String ymd = sdf.format(new Date())
ctxPath += File.separator + ymd + File.separator
System.out.println("ctxpath="+ctxPath)
// 创建文件夹
File file = new File(ctxPath)
if (!file.exists()) {
file.mkdirs()
}
String fileName = null
for (Map.Entry<String, MultipartFile>entity : fileMap.entrySet()) {
// 上传文件
MultipartFile mf = entity.getValue()
fileName = mf.getOriginalFilename()//获取原文件名
System.out.println("filename="+fileName)
File uploadFile = new File(ctxPath + fileName)
try {
FileCopyUtils.copy(mf.getBytes(), uploadFile)
responseStr="上传成功"
} catch (IOException e) {
responseStr="上传失败"
e.printStackTrace()
}
}
return responseStr
}
手机端图片-导入-一键适配保存就可以了 可以先上传到图片空间 更改下载好的CSV数据的存储位置,加上创建一个数据库的文件夹,因为你下载存储的位置与卖家的存在位置不一致,更改几个位置试试!希望帮到你! 你...欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）