引入jQuery库
引入ajaxfileupload.js上传插件库(这也是jQuery的一个插件)
以ASP.NET为例 <input type="file" id="uploadfile" name="uploadfile"/>
<script type="text/javascript">
$("#uploadfile").change(function(){ $.ajaxFileUpload({
url: '../ajax/AjaxCallback.ashx',//处理上传用的后台程序,可以是PHP,也可以是ASP等
secureuri: false,//异步
fileElementId: 'uploadfile',//上传控件ID
dataType: 'json',//返回的数据信息格式
success: function(data, status) {
if (data.code == '10000') {
alert("上传成功"); } else {
alert("上传失败");
}
}, error: function(data, status, e) {
alert(e);
}
}) }); </script>
后台CS代码 /// <summary>
/// 图片上传
/// </summary>
private void ImageUpload()
{
Response.ContentType = "text/html";//这里一定要html
if (Request.Files.Count > 0)
{
HttpPostedFile file = Request.Files[0];
if (file.ContentLength > 0)
{
string suffix = file.FileName.Substring(file.FileName.LastIndexOf('.'));//后缀
if (".jpg.png.gif.jpeg".IndexOf(suffix.ToLower()) == -1)//文件格式,这里采用图片格式说明
{
Response.Write("{\"msg\":\"文件格式不正确!\",code:\"10001\"}");
return;
} try
{
file.SaveAs(Server.MapPath("~/uploadfile/") + newName);
Response.Write("{\"msg\":\"" + newName + "\",code:\"10000\"}");
return;
}
catch (Exception ex)
{
Response.Write("{\"msg\":\"" + HttpUtility.HtmlEncode(ex.Message) + "\",code:\"10001\"}");
return;
}
}
Response.Write("{\"msg\":\"请选择要上传的文件!\",code:\"10001\"}");
return;
}
Response.Write("{\"msg\":\"请选择要上传的文件!\",code:\"10001\"}");
return;
}
http://www.cnblogs.com/linjiqin/p/3530848.html
http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html
http://www.phpletter.com/cn/Demo/AjaxFileUpload-Demo/

Jq_input file标签上传图片到服务器的更多相关文章

  1. jsp页面file标签上传图片以及blob类型数据库存取。

    我的jsp页面表单如下: <form name="form1" action="/YiQu/AddUserServlet?jurisdiction=1" ...

  2. asp.net type=file在上传图片到服务器

    前台 <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> ...

  3. html之file标签 --- 图片上传前预览 -- FileReader

    记得以前做网站时,曾经需要实现一个图片上传到服务器前,先预览的功能.当时用html的<input type="file"/>标签一直实现不了,最后舍弃了这个标签,使用了 ...

  4. 通过android 客户端上传图片到服务器

    昨天,(在我的上一篇博客中)写了通过浏览器上传图片到服务器(php),今天将这个功能付诸实践.(还完善了服务端的代码) 不试不知道,原来通过android 向服务端发送图片还真是挺麻烦的一件事. 上传 ...

  5. file标签选择文件change事件失效处理方法

    file只能处罚一次change事件,在change事件中重新替换file标签即可生效 eg: $(function(){ //上传图片 $("body").on("ch ...

  6. Wcf for wp8 上传图片到服务器,将图片名字插入数据库字段(五)

    环境:.NET Framework 3.5 服务: IIS EXpress托管 WCF服务程序 配置:Web.config <!--<connectionStrings> <a ...

  7. angularjs中使用 <input type="file">标签实现一次最多上传5张图片

    前期准备: 1.angular.js 2.bootstrap.css 具体如何实现呢?请看下面代码哈哈哈. 在angular项目中,如果要给<input type="file" ...

  8. .NET开发微信小程序-上传图片到服务器

    1.上传图片分为几种: a:上传图片到本地(永久保存) b:上传图片到本地(临时保存) c:上传图片到服务器 a和b在小程序的api文档里面有.直接说C:上传图片到服务器 前端代码: /* 上传图片到 ...

  9. Android 上传图片到服务器二--------调用相机7.0以上权限问题

    [目录] (一)上传图片到服务器一 ---------------------------------Android代码 (二)上传图片到服务器二--------------------------- ...

随机推荐

  1. jquery.validate,错误信息位置

    好长时间没有用jquery.validate.js这个插件了,忘得差不多了.唉,好东西还是要经常拿出来看看的,今天用jquery.validate来做一个小东西,遇到一个问题,就是错误提示信息的位置问 ...

  2. cat > file << EOF 与 cat > file << -

    当我们在使用kickstart 的时候,会遇到写网卡配置文件的情况,这时候我们使用cat > file << EOF 命令等,可以从标准输入中接受输入并保存到 file 文件中. c ...

  3. 【转载】sql注入之入门

    原文在:https://smelond.com MySql基础语法 mysql无非就是增删改查 mysql数据库结构: 数据库 test,test1 表名 admin,manage 数据 id,use ...

  4. Python3编写网络爬虫02-基本请求库requests的使用

    一.requests 库使用 需要安装 pip install requests import requests #导入requests库 request = requests.get("h ...

  5. 获取QQ头像接口

    https://q4.qlogo.cn/g?b=qq&nk=QQ号码&s=140

  6. BZOJ4184:shallot(线段树分治,线性基)

    Description 小苗去市场上买了一捆小葱苗,她突然一时兴起,于是她在每颗小葱苗上写上一个数字,然后把小葱叫过来玩游戏. 每个时刻她会给小葱一颗小葱苗或者是从小葱手里拿走一颗小葱苗,并且 让小葱 ...

  7. Android MaterialDesign之水波点击效果的几种实现方法

    什么是水波点击的效果? 下面是几种不同的实现方法的效果图以及实现方法   Video_2016-08-31_003846 如何实现? 方法一 使用官方提供的RippleDrawable类 优点:使用方 ...

  8. webservice 客户端调用

    /** * 通过webserevice下发工单 * @param url * @param method * @param requestMap * @return * @throws Service ...

  9. Rsyslog配置文件详解(转)

    最近在搭建日志审计服务器,使用了rsyslog,发现这篇文章很有用,收藏一下. 原文链接:http://my.oschina.net/0757/blog/198329 具体内容: 非常详细的rsysl ...

  10. HDU 2159 FATE(有选择物品总个数限制的完全背包,经典!!)

    FATE Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit Status ...