首页 > 代码库 > Jquery+ajaxfileupload上传文件
Jquery+ajaxfileupload上传文件
1、说明
ajaxfileupload.js是一款jQuery插件,用于通过ajax上传文件。
下载地址:http://files.cnblogs.com/files/lengzhan/ajaxfileupload.zip
2、使用方法
首先引用js脚本
<script src="http://www.mamicode.com/Scripts/jquery/jquery-1.9.1.js" type="text/javascript"></script> <script src="http://www.mamicode.com/Scripts/ajaxfileupload.js" type="text/javascript"></script>
<script type="text/javascript"> $(function () { $("#btnUpload").on(‘click‘, DoUpload); }) function DoUpload() { var image = $("#txtPath").val(); if ($.trim(image) == "") { alert("请选择文件!"); return; } $.ajaxFileUpload( { url: ‘Handler/FileUploadHandler.ashx?type=Attachment‘, secureuri: false, fileElementId: $("#fleFile").attr("id"), dataType: ‘json‘, success: function (data, status) { if (data.url === "") { alert("上传失败!"); } else { alert("上传成功!"); } }, error: function (result) { alert("上传失败!"); } }); } </script>
然后是html代码
<div id="ImageMaintain"> <input type="hidden" name="hidImgUrl" id="hidImgUrl" value="" /> <div id="uploadarea"> <input id="txtPath" type="text" disabled="disabled" /> <input id="fleFile" type="file" name="fleFile" onchange="document.getElementById(‘txtPath‘).value = http://www.mamicode.com/this.value;return false;" /> <input id="btnSelect" type="button" value="http://www.mamicode.com/选择" class="button" style="width: 60px;" /> <input id="btnUpload" type="button" value="http://www.mamicode.com/上传" class="button" style="width: 60px;" /> </div> </div>
最后是一般处理程序
<%@ WebHandler Language="C#" Class="FileUploadHandler" %>using System;using System.Web;using System.IO;public class FileUploadHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; string strMessage = string.Empty; string strUrl = string.Empty; string strFloderName = "Upload"; string strNewFilePath = string.Empty; string strFileName = Path.GetFileName(context.Request.Files[0].FileName); string strOldFileName = Path.GetFileName(context.Request.Files[0].FileName); int intFileSize = context.Request.Files[0].ContentLength; string datahttp://www.mamicode.com/= ""; if (context.Request.Files.Count > 0 && strFileName != "") { string strExt = Path.GetExtension(context.Request.Files[0].FileName); strExt = strExt.TrimStart(‘.‘).ToLower(); strFloderName = strFloderName + "/" + "File/" + DateTime.Now.ToString("yyyyMMdd"); string path = HttpContext.Current.Server.MapPath("../" + strFloderName); try { strFileName = Guid.NewGuid().ToString() + ("." + strExt); if (!Directory.Exists(path)) { Directory.CreateDirectory(path); } strNewFilePath = Path.Combine(path, strFileName); context.Request.Files[0].SaveAs(strNewFilePath); } catch (Exception ex) { strMessage = "保存失败"; strUrl = string.Empty; } } strMessage = ""; strUrl = strFloderName + "/" + strFileName; datahttp://www.mamicode.com/= "{\"strUrl\":\"" + strUrl + "\",\"strMessage\":\"" + strMessage + "\"}"; context.Response.Write(data); context.Response.End(); } public bool IsReusable { get { return false; } }}
3、图片上传
这里会把DEMO上传至博客园,下载地址:http://files.cnblogs.com/files/lengzhan/UploadAjaxFile.zip
Jquery+ajaxfileupload上传文件
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。