ajaxfileupload插件可以以异步方式上传文件（其实现：iframe），不像传统那样需要刷新，下面就介绍下其使用

1、HTML部分（先引入jquery）：

 <!DOCTYPE html>

 <html>

 <head>

     <meta charset="utf-8">

     <title>无刷新单文件上传</title>

     <script src="jquery-2.2.4.min.js"></script>

     <script src="ajaxfileupload.js"></script>

 </head>

 <body>

     <p style="display:none"><input type="file" id="file1" name="file" /></p>

     <input type="button" value="上传" />

     <script type="text/javascript">

         $(function () {

             $(":button").click(function () {

                 $("#file1").click();

             })

         })

         $(document).on("change", "#file1", function () {

             $.ajaxFileUpload({

                 url: '/upload.ashx', //用于文件上传的服务器端请求地址

                 secureuri: false, //一般设置为false

                 fileElementId: 'file1', //文件上传空间的id属性  <input type="file" id="file" name="file" />

                 dataType: 'json', //返回值类型 一般设置为json

                 success: function (data, status)  //服务器成功响应处理函数

                 {

                     if (typeof (data.error) != 'undefined') {

                         if (data.error != '') {

                             alert(data.error);

                         } else {

                             alert(data.msg);

                         }

                     }

                 },

                 error: function (data, status, e)//服务器响应失败处理函数

                 {

                     alert(e);

                 }

             })

         });

     </script>

 </body>

 </html>

2、后台代码（使用的一般处理程序[ashx]）：

     public class upload : IHttpHandler

     {

         public void ProcessRequest(HttpContext context)

         {

             HttpFileCollection files = context.Request.Files;

             string msg = string.Empty;

             string error = string.Empty;

             string imgurl;

             if (files.Count > )

             {

                 files[].SaveAs(context.Server.MapPath("/") + System.IO.Path.GetFileName(files[].FileName));

                 msg = " 成功! 文件大小为:" + files[].ContentLength;

                 imgurl = "/" + files[].FileName;

                 string res = "{ error:'" + error + "', msg:'" + msg + "',imgurl:'" + imgurl + "'}";

                 context.Response.Write(res);

                 context.Response.End();

             }

         }

         public bool IsReusable

         {

             get

             {

                 return false;

             }

         }

     }

注意：IE低版本可能会不兼容（上传文件框被隐藏，而是通过点击按钮去模拟触发文件框点击事件）

参考：http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html

ajaxfileupload异步上传文件的更多相关文章

  1. 【转】JQuery插件ajaxFileUpload 异步上传文件（PHP版）

    前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...

  2. JQuery插件ajaxFileUpload 异步上传文件（PHP版）

    太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...

  3. struts2 jquery ajaxFileUpload 异步上传文件

    网上搜集的,整理一下. 一.ajaxFileUpload 实现异步上传文件利用到了ajaxFileUpload.js这个文件,这是别人开发的一个jquery的插件,可以实现文件的上传并能够和strut ...

  4. jquery ajaxFileUpload异步上传文件

    ajaxFileUpload.js 很多同名的,因为做出来一个很容易. 我用的是这个:https://github.com/carlcarl/AjaxFileUpload 下载地址在这里:http:/ ...

  5. JQuery插件ajaxFileUpload 异步上传文件

    一.先对ajaxFileUpload插件的语法参数进行讲解 原理:ajaxfileupload是通过监听iframe的onload方法来实现, 当从服务端处理完成后,就触发iframe的onload事 ...

  6. 利用ajaxfileupload.js异步上传文件

    1.引入ajaxfileupload.js 2.html代码 <input type="file" id="enclosure" name="e ...

  7. 异步上传文件,ajax上传文件,jQuery插件之ajaxFileUpload

    http://www.cnblogs.com/kissdodog/archive/2012/12/15/2819025.html 一.ajaxFileUpload是一个异步上传文件的jQuery插件. ...

  8. jQuery插件之ajaxFileUpload异步上传

    介绍 AjaxFileUpload.js 是一个异步上传文件的jQuery插件,原理是创建隐藏的表单和iframe然后用JS去提交,获得返回值. 下载地址: http://files.cnblogs. ...

  9. Servlet异步上传文件

    这里需要用到插件ajaxfileupload.js,jar包:commons-fileupload-1.3.2.jar,commons-io-2.5.jar 注意红色部分的字!!!! 1.创建一个we ...

随机推荐

  1. java基础知识-冒泡排序

    //冒泡排序,从数组前面向后循环比较 public static void sort1(int[] aa){ int size=aa.length; int temp; //循环数组 for(int ...

  2. Oracle解决索引碎片功能

    我们开始时向一个空的带索引的表中插入大量数据后,是不会产生碎片问题的,但是,数据库经过很长一段时间的增删改查后,难免会出现碎片问题,影响数据库的性能,Oracle对于这一问题有自己的解决方案. 下面介 ...

  3. BZOJ4399 魔法少女LJJ（线段树合并）

    注意到只有增加点/合并的操作.这些操作都可以用线段树完成,于是线段树合并一发就好了.注意乘积大小直接比较肯定会炸,取个对数即可.数据中存在重边. #include<iostream> #i ...

  4. [洛谷P1747]好奇怪的游戏

    题目大意:有两匹马,马可以走"日",也可以像象走"田",求它走到(1,1)的步数. 题解:bfs 卡点:边界判断成了可以走到(0,y)或(x,0) C++ Co ...

  5. VB托盘图标不响应WM_MOUSEMOVE的原因及解决方法

    文章参考地址:http://blog.csdn.net/txh0001/article/details/38265895:http://bbs.csdn.net/topics/330106030 网上 ...

  6. POJ2155 Matrix 【二维线段树】

    题目链接 POJ2155 题解 二维线段树水题,蒟蒻本想拿来养生一下 数据结构真的是有毒啊,, TM这题卡常 动态开点线段树会TLE[也不知道为什么] 直接开个二维数组反倒能过 #include< ...

  7. [链接] Linux下常见的~/.bashrc、/etc/profile、/etc/ld.so.config小科普以及caffe编译遇到的相关问题解决

    由于博主设置禁止转载,这里贴一个链接,http://blog.csdn.net/u014266895/article/details/61928602,内容很有用,linux下很多软件问题都是各种路径 ...

  8. 对zip文件进行解压操作和对一个文件进行压缩操作

    注意这里用的是apche下的zip package org.springframework.validation; import org.apache.tools.zip.ZipEntry; impo ...

  9. 浏览器 连不上网 (3)：DNS 服务器问题

    解决:设置一下DNS服务器的地址 步骤: 打开网络和共享中心(网络和 Internet设置)-> 更改适配器 -> 双击我们连接的 无线网(WiFi式) 或 以太网(网线式): 从出现的窗 ...

  10. iBatis之Iterator的使用

    一:前言 现在这个项目使用的是iBatis,我刚刚开始的时候说是用MyBatis,因为我以前用过,觉得还是比较好用的啊,而且不像iBatis样,查什么一个字段不能多也不能少,觉得好无语啊. 二:内容 ...