使用AjaxFileUpload.js实现文件异步上�
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实现文件异步上�的更多相关文章
- asp.net 基于ajaxfileupload.js 实现文件异步上传
前台代码: /*修改头像*/ //上传 function _sc() { $(".ckfile").html("") ...
- SpringMVC结合ajaxfileupload.js实现文件无刷新上传
直接看代码吧,注释都在里面 首先是web.xml <?xml version="1.0" encoding="UTF-8"?> <web-ap ...
- js 文件异步上传 显示进度条 显示上传速度 预览文件
通常文件异步提交有几个关键 1.支持拖拽放入文件.2.限制文件格式.3.预览图片文件.4.上传进度,速度等,上传途中取消上传.5.数据与文件同时上传 现在开始笔记: 需要一个最基础的元素<inp ...
- SpringMVC + AJAX 实现多文件异步上传
转自:https://www.jianshu.com/p/f3987f0f471f 今天,我就这个问题来写一篇如何用 SpringMVC + AJAX 实现的多文件异步上传功能.基本的代码还是沿用上篇 ...
- HTML5实现图片文件异步上传
原文:HTML5实现图片文件异步上传 利用HTML5的新特点做文件异步上传非常简单方便,本文主要展示JS部分,html结构.下面的代码并未使用第三发库,如果有参照,请注意一些未展现出来的代码片段.我这 ...
- 文件的上传(表单上传和ajax文件异步上传)
项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举的主要对于小文件上传的处理! 资源下载: 一. ...
- 普通文件的上传(表单上传和ajax文件异步上传)
一.表单上传: html客户端部分: <form action="upload.ashx" method="post" enctype="mul ...
- MVC文件上传04-使用客户端jQuery-File-Upload插件和服务端Backload组件实现多文件异步上传
本篇使用客户端jQuery-File-Upload插件和服务端Badkload组件实现多文件异步上传.MVC文件上传相关兄弟篇: MVC文件上传01-使用jquery异步上传并客户端验证类型和大小 ...
- 文件的上传(1)(表单上传和ajax文件异步上传)
文件的上传(表单上传和ajax文件异步上传) 项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举 ...
随机推荐
- Android ReceiverCallNotAllowedException: BroadcastReceiver components are not allowed to register to receive intents
ReceiverCallNotAllowedException mContext.registerReceiver()不能在BroadcastReceiver的onReceive()里面调用 可以通过 ...
- 面试中的Singleton
引子 “请写一个Singleton.”面试官微笑着和我说. “这可真简单.”我心里想着,并在白板上写下了下面的Singleton实现: 1 class Singleton 2 { 3 public ...
- PB数据管道
数据管道提供了一种不同数据库之间传递数据和(或)表结构的方法. 数据管道对象 要完毕数据管道的功能须要提供例如以下内容: 须要数据源和目标数据库,并可以和这两个数据库正常联接 须要源数据库中的哪些表: ...
- linux下编译.so 和.a 可能出现的问题 ?
1. 静态函数库 这类库的名字一般是libxxx.a:利用静态函数库编译成的文件比较大,因为整个 函数库的所有数据都会被整合进目标代码中,他的优点就显而易见了,即编译后的执行程序不需要外部的函数库支持 ...
- Linux的inode的理解 [转]
Linux的inode的理解 [转] 一.inode是什么? 理解inode,要从文件储存说起. 文件储存在硬盘上,硬盘的最小存储单位叫做"扇区"(Sector).每个扇区储存51 ...
- 详解js和jquery里的this关键字
详解js和jquery里的this关键字 js中的this 我们要记住:this永远指向函数运行时所在的对象!而不是函数被创建时所在的对象.this对象是在运行时基于函数的执行环境绑定的,在全局环境中 ...
- PS大头照的背景
给同事ps一个大头照,只是修改一下背景颜色,以前没有做过,这次算是小练习了一把,与大家分享一下.修改大头照背景重要的是如何选中背景的区域,如果用魔棒选择的话,头与背景的边处理的不好,说说我的处理方法吧 ...
- MongoDB---性能优化---(1)
MONGODB数据架构 升级解决.计划 发现问题 应用server用户数的突然涌入,创建server反应慢 检查server,我发现,每次反应非常慢,至30ops 检查过程 .发现数据库查询缓 ...
- 解决Xcode 7编译错误:does not contain bitcode
连接地址:http://jingyan.baidu.com/article/8065f87f96cf462331249801.html 好不容易更新到Xcode 7.0.1,重新编译代码,报错: do ...
- android multicast 多播(组播)问题
有谁遇到过同样问题的可以探讨下,或者已经解决问题的,能够指导下我 获取组播锁 private InetAddress group; WifiManager wm=(WifiManager ...