ajaxfileupload插件上传图片功能，用MVC和aspx做后台各写了一个案例
HTML代码 和js 代码
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script src="~/js/jquery-1.8.3.min.js"></script>
<script src="~/js/ajaxfileupload.js"></script>
<script type="text/javascript">
$(function () {
$("#butLoad").click(function () {
$("#img1").attr("src", "../images/timg.gif");
//调用action
$.ajaxFileUpload({
url: "../Upload/UpLoad",
secureuri: false, //一般设置为false
fileElementId: 'Img', //文件上传空间的id属性 <input type="file" id="Img" name="file" />
dataType: 'json', //返回值类型
success: function (data, status) //服务器成功响应处理函数
{
$("#img1").attr("src", data.imgurl);
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
alert(data.error);
} else {
alert(data.msg);
}
}
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert(e);
}
});
});
$("#butLoadAsp").click(function () {
$("#imgAsp").attr("src", "../images/timg.gif");
//调用aspx
$.ajaxFileUpload({
url: "../Ajax/UpLoad.aspx?__Action=UpLoadImg",
secureuri: false, //一般设置为false
fileElementId: 'ImgAsp', //文件上传空间的id属性 <input type="file" id="Img" name="file" />
dataType: 'json', //返回值类型
success: function (data, status) //服务器成功响应处理函数
{
$("#imgAsp").attr("src", data.imgurl);
if (typeof (data.error) != 'undefined') {
if (data.error != '') {
alert(data.error);
} else {
alert(data.msg);
}
}
},
error: function (data, status, e)//服务器响应失败处理函数
{
alert(e);
}
});
});
});
function ChImages(obj) {
$("#img1").attr("src", obj.value)
}
</script>
</head>
<body>
<div>
<h3>mvc-ajax</h3>
<input type="file" id="Img" name="file" onchange="ChImages(this)" /> @*注意：name一定要写*@
<button id="butLoad">上传</button>
<img src="" id="img1" alt="请选择图片" width="" />
</div>
<div>
<h3>asp.net-ajax</h3>
<input type="file" id="ImgAsp" name="file" /> @*注意：name一定要写*@
<button id="butLoadAsp">上传</button>
<img src="" id="imgAsp" alt="请选择图片" width="" />
</div>
</body>
</html>
mvc 控制中代码
[HttpPost]//过滤
public JsonResult UpLoad()
{ HttpFileCollectionBase files = Request.Files;//这里只能用<input type="file" />才能有效果,因为服务器控件是HttpInputFile类型
object result = new { error="error", msg="上传失败",imgurl= files[].FileName};
string msg = string.Empty;
string error = string.Empty;
string imgurl;
if (files.Count > )
{
string savePath = Server.MapPath("/") + "UpLoadImg\\";//保存文件地址
//string saveDir = System.Web.HttpContext.Current.Server.MapPath(savePath);
if (!Directory.Exists(savePath)) {
Directory.CreateDirectory(savePath);
}
files[].SaveAs(savePath + System.IO.Path.GetFileName(files[].FileName));
msg = " 成功! 文件大小为:" + files[].ContentLength;
imgurl = "../UpLoadImg/" + files[].FileName;
result =new { error="success", msg= msg, imgurl=imgurl };
}
return Json(result, "text/html");
}
aspx.cs 代码
public partial class UpLoad : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string action = Request["__Action"];
if (action==null || action == string.Empty)
return;
Page p = this;
Type pageType = p.GetType();
MethodInfo method = pageType.GetMethod(action);
if (method != null)
method.Invoke(p, null);
}
public void UpLoadImg()
{
HttpFileCollection files = Request.Files;//这里只能用<input type="file" />才能有效果,因为服务器控件是HttpInputFile类型
// object result = new { error = "error", msg = "上传失败", imgurl = files[0].FileName };
string result = "{ error:'error', msg:'上传失败',imgurl:'" + files[].FileName + "'}";
string msg = string.Empty;
string error = string.Empty;
string imgurl;
if (files.Count > )
{
string savePath = Server.MapPath("/") + "UpLoadImg\\";//保存文件地址
//string saveDir = System.Web.HttpContext.Current.Server.MapPath(savePath);
if (!Directory.Exists(savePath))
{
Directory.CreateDirectory(savePath);
}
files[].SaveAs(savePath + System.IO.Path.GetFileName(files[].FileName));
msg = " 成功! 文件大小为:" + files[].ContentLength;
imgurl = "../UpLoadImg/" + files[].FileName;
result = "{ error:'" + error + "', msg:'" + msg + "',imgurl:'" + imgurl + "'}";
}
Response.Clear();
Response.Write(result.ToString());
Response.End(); }
}
MVC和aspx 有些不同，MVC获取HttpInputFile 用HttpFileCollectionBase 类，aspx获取HttpInputFile 用HttpFileCollection 类
个人学习，请多多指教
代码：http://files.cnblogs.com/files/BensonHai/UploadImage.rar 本人是用VS2015写的
ajaxfileupload插件上传图片功能，用MVC和aspx做后台各写了一个案例的更多相关文章
- sql server 关于表中只增标识问题 C# 实现自动化打开和关闭可执行文件（或 关闭停止与系统交互的可执行文件） ajaxfileupload插件上传图片功能，用MVC和aspx做后台各写了一个案例 将小写阿拉伯数字转换成大写的汉字， C# WinForm 中英文实现， 国际化实现的简单方法 ASP.NET Core 2 学习笔记（六）ASP.NET Core 2 学习笔记（三）
sql server 关于表中只增标识问题 由于我们系统时间用的过长,数据量大,设计是采用自增ID 我们插入数据的时候把ID也写进去,我们可以采用 关闭和开启自增标识 没有关闭的时候 ,提示一下错 ...
- ASP.NET MVC 中使用 AjaxFileUpload 插件时，上传图片后不能显示（预览）
AjaxFileUpload 插件是一个很简洁很好用的上传文件的插件,可以实现异步上传功能,但是在 ASP.NET MVC中使用时,会出现上传图片后不能正确的显示的问题,经过仔细排查,终于找到原因,解 ...
- aspx页面中用Input 标签实现上传图片功能
实现上传图片功能需单独的建立一个aspx页面, 其中前台页面需要注意两点: a)实现上传功能的input的type="file" b)设置请求报文头为 enctype=" ...
- jQuery插件之ajaxFileUpload(异步上传图片并实时显示，并解决onchange后ajaxFileUpload失效问题)
参考学习: 第一篇:http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 第二篇:http://www.jb51.net/a ...
- MVC ueditor的使用(实现上传图片功能)
之前使用ckeditor不能实现上传图片功能,只要是我不知道怎么使用啦o(￣ε￣*),然后就换了ueditor~~,可以实现上传图片功能啦~\(≧▽≦)/~~ 下面是我的步骤:去官网下载最新版uedi ...
- ajaxFileUpload插件
关键词: $.ajaxFileUpLoad(); data status dataType 参考资料: http://www.cnblogs.com/kissdodog/archive/2012/12 ...
- 实用的ajaxfileupload插件
一.ajaxFileUpload是一个异步上传文件的jQuery插件. 传一个不知道什么版本的上来,以后不用到处找了. 语法:$.ajaxFileUpload([options]) options参数 ...
- 富文本文件CKEDITOR增加上传图片功能(.net)
如题,本身的CKEDITOR控件并没有开启上传图片的功能, 打开图像按钮,只有图像信息和高级两个table选项卡,版本不同,显示略有差异,我的实现是有两种方法都可以添加上传功能, 第一种方法使用CKE ...
- 利用webuploader插件上传图片文件,完整前端示例demo,服务端使用SpringMVC接收
利用WebUploader插件上传图片文件完整前端示例demo,服务端使用SpringMVC接收 Webuploader简介 WebUploader是由Baidu WebFE(FEX)团队开发的一 ...
随机推荐
- Quartz实现JAVA定时任务的动态配置
什么是动态配置定时任务? 首先说下这次主题,动态配置.没接触过定时任务的同学可以先看下此篇:JAVA定时任务实现的几种方式 定时任务实现方式千人千种,不过基础的无外乎 1.JDK 的Timer类 2. ...
- 25个必须记住的SSH命令
OpenSSH是SSH连接工具的免费版本.telnet,rlogin和ftp用户可能还没意识到他们在互联网上传输的密码是未加密的,但SSH 是加密的,OpenSSH加密所有通信(包括密码),有效消 ...
- CentOS+Tomcat环境搭建
此次搭建是基于: CentOS release 5.6 (Final) Kernel \r on an \m 搭建准备:http://pan.baidu.com/s/1pLt1lLh apache-t ...
- 「小程序JAVA实战」小程序的springboot后台拦截器（61）
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudespringboothoutailanjieqi60/ 之前咱们把 ...
- Android bitmap转byte
逆转start协议输出 private static byte[] bitmap2byte(Bitmap bmp) throws Exception{ return bitmap2byte(bmp, ...
- XACT Q&A （转）
XACT Q&A 传送门:http://blog.csdn.net/xoyojank/article/details/4098633
- C#泛型序列化困境
[C#泛型序列化困境] 问题的起因是这样,有一个需求,将JsonArray转化为List,JsonArray中的元素均是string,此string可被转化为int.float.或维持string.我 ...
- 第七章 二叉搜索树（b1）BST：查找
- 解决Springboot集成ActivitiModel提示输入用户名密码的问题
一.原因分析 先要知道两点 - SpringBoot会根据引入的Jar包而自动配置相应的功能. - ActivitiModeler中引用了Spring Security的Jar.(是一个安全或者说权限 ...
- Git忽略规则及.gitignore规则不生效的解决办法(转)
在git中如果想忽略掉某个文件,不让这个文件提交到版本库中,可以使用修改根目录中 .gitignore 文件的方法(如无,则需自己手工建立此文件).这个文件每一行保存了一个匹配的规则例如: # 此为注 ...