ajax是无法提交文件的,所以在上传图片并预览的时候,我们常常使用Ifame的方法实现看似异步的效果。可是这样总不是非常方便的,AjaxFilleUpload.js对上面的方法进行了一个包装,使得我们不用去管理Iframe的一系列操作,也不用影响我们的页面结构,实现异步的文件提交。

html:

<input type="file" name="upload" hidden="hidden" id="file_upload" accept=".zip" />

js:

$.ajaxFileUpload({
url:'${pageContext.request.contextPath}/Manage/BR_restorePic.action', //须要链接到server地址
secureuri:false,
fileElementId:'file_upload', //文件选择框的id属性
dataType: 'text', //server返回的格式,能够是json、xml
success: function (data, status) //相当于java中try语句块的使用方法
{ $('#restoreDialog').html(data); //alert(data);
},
error: function (data, status, e){ //相当于java中catch语句块的使用方法 $('#restoreDialog').html("上传失败,请重试");
}
});

这种方法还会出现一个问题,就是input仅仅能使用一次的问题,input第二次的onchange将不会被运行,这应该是与浏览器的有关,解决的方法就是替换这个input

像这样:

$('#file_upload').replaceWith('<input type="file" name="upload" hidden="hidden" id="file_upload" accept=".zip" />');

使用AjaxFileUpload.js实现文件异步上�的更多相关文章

  1. asp.net 基于ajaxfileupload.js 实现文件异步上传

    前台代码: /*修改头像*/       //上传       function _sc() {           $(".ckfile").html("") ...

  2. SpringMVC结合ajaxfileupload.js实现文件无刷新上传

    直接看代码吧,注释都在里面 首先是web.xml <?xml version="1.0" encoding="UTF-8"?> <web-ap ...

  3. js 文件异步上传 显示进度条 显示上传速度 预览文件

    通常文件异步提交有几个关键 1.支持拖拽放入文件.2.限制文件格式.3.预览图片文件.4.上传进度,速度等,上传途中取消上传.5.数据与文件同时上传 现在开始笔记: 需要一个最基础的元素<inp ...

  4. SpringMVC + AJAX 实现多文件异步上传

    转自:https://www.jianshu.com/p/f3987f0f471f 今天,我就这个问题来写一篇如何用 SpringMVC + AJAX 实现的多文件异步上传功能.基本的代码还是沿用上篇 ...

  5. HTML5实现图片文件异步上传

    原文:HTML5实现图片文件异步上传 利用HTML5的新特点做文件异步上传非常简单方便,本文主要展示JS部分,html结构.下面的代码并未使用第三发库,如果有参照,请注意一些未展现出来的代码片段.我这 ...

  6. 文件的上传(表单上传和ajax文件异步上传)

    项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举的主要对于小文件上传的处理! 资源下载: 一. ...

  7. 普通文件的上传(表单上传和ajax文件异步上传)

    一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="mul ...

  8. MVC文件上传04-使用客户端jQuery-File-Upload插件和服务端Backload组件实现多文件异步上传

    本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小  ...

  9. 文件的上传(1)(表单上传和ajax文件异步上传)

    文件的上传(表单上传和ajax文件异步上传) 项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举 ...

随机推荐

  1. 使用Spring标签库

    A.Spring标签库 Web项目若使用Spring Web MVC并使用JSP作为表现的话.从Spring2.0版本开始提供一套标签库可供使用. 使用标签库无非是易于开发,维护之类云云.这里就不阐述 ...

  2. GitLab 之 Linux十分钟快装

    原文链接:http://www.cnblogs.com/highsea90/p/5191340.html 先把 Shell 命令贴出来,楼主以 CentOS release 6.5 (Final) 6 ...

  3. [置顶] 自娱自乐7之Linux UDC驱动2(自编udc驱动,现完成枚举过程,从驱动代码分析枚举过程)

    花了半个月,才搞定驱动中的枚举部分,现在说linux的枚举,windows可能有差别. 代码我会贴在后面,现在只是实现枚举,你可能对代码不感兴趣,我就不分析代码了,你可以看看 在<自娱自乐1&g ...

  4. poj 1182食物链(并查集)

    算法思路:把那些确定了相对关系的节点放在同一棵树里(可以同时存在多棵树,单独每棵树中节点的相对关系确定),每个节点对应的 v[] 值记录他与根节点的关系( 0:同类: 1:根吃他: 2:他吃根 ).当 ...

  5. _splitpath / _wsplitpath 将绝对路径分割为盘符、路径、文件名、扩展名。

    今天分享下一个路径分割的API,可以将一个完整的绝对路径分割为: 盘符(包括冒号:) 路径(包含前面&后面的\,不含盘符&文件名) 文件名(不含扩展名) 扩展名(包含前面的.) 先不说 ...

  6. 平均时间复杂度为O(nlogn)的排序算法

    本文包括 1.快速排序 2.归并排序 3.堆排序 1.快速排序 快速排序的基本思想是:采取分而治之的思想,把大的拆分为小的,每一趟排序,把比选定值小的数字放在它的左边,比它大的值放在右边:重复以上步骤 ...

  7. 来推荐个免费的PPT演示工具--ZohoShowTime

    事实上这个不算新产品了,这次是做了一些大的改进.上次在Zoho的全球用户大会上,全程演讲都是用的这个工具.Zoho这点非常好啊.自己的产品自己带头用.个人认为它最大的用处就是.离得远的观众能够在自己的 ...

  8. KaOS 2016.04 发布,桌面 Linux 发行版

    KaOS 2016.04 发布了,KaOS是一份桌面Linux发行,其特色在于最新版本的KDE桌面环境及其他流行的使用Qt工具包的软件程序.它最初基于Arch Linux,但从2013年四月起,开发者 ...

  9. 在C++工程中main函数之前跑代码的廉价方法(使用全局变量和全局函数)

    // test.cpp : Defines the entry point for the console application. // #include "stdafx.h" ...

  10. Javascript跨域请求的几种解决方法

    什么情况下才会出现跨域? 假设域名是:http://www.example.com.cn/ 如果所请求的域名跟这个域名不致,这种情况就是跨域,由于跨域存在漏洞,所以一般来说正常的跨域请求方式是请求不到 ...