ajaxFileUpload文件上传
一、简介
ajaxFileUpload是一种异步的文件上传控件,通过ajax进行文件上传,并获取上传处理结果。在很多时候我们需要使用到文件上传的功能,但是不需要使用那些强大的上传插件。此时就可以使用ajaxFileUpload。它基于jquery,本质是使用iframe完成上传。下载地址为:下载 。
二、实例
网页代码如下:
<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>文件上传</title>
</head>
<body>
<div>
<form id="formItem">
<div id="contentTable" style="border:0px;">
<h1 class="title" style="font-size:15px;border-bottom:1pxsolid#DFE3E6;">excel文件上传</h1>
<table width="80%">
<tr>
<td width="30%" align="right">
选择要上传的excel文件
</td>
<td width="70%" style="text-align:center;">
<input type="file" id="file1" name="file"/>
</td>
</tr>
</table>
<div>
<input type="button" value="导入 "/>
</div>
</div>
</form>
</div>
<scriptsrc="${pageContext.request.contextPath}/res/js/jquery-1.9.1.min.js"type="text/javascript"></script>
<scriptsrc="${pageContext.request.contextPath}/res/js/ajaxfileupload.js"></script>
<scripttype="text/javascript">
var flag=false;
$(function(){
//文件类型过滤
$(":button").click(function(){
varfilepath = $("#file1").val();
vararr = new Array();
arr = filepath.split(".");
var fileType = new Array(["xls"],["xlsx"]);
for(var i = 0; i < fileType.length; i++){
if(arr[1] == fileType[i]){
flag = true;
}
}
if(flag){
ajaxFileUpload();
}else{
alert("请选择excel文件上传")
return false;
}
})
}); functionajaxFileUpload(){
$.ajaxFileUpload
(
{
url : '${pageContext.request.contextPath}/file/upload.action',//用于文件上传的服务器端请求地址
secureuri : false,//一般设置为false
fileElementId : 'file1',//文件上传空间的id属性
dataType : 'json',//返回值类型一般设置为json
success : function(data,status)//服务器成功响应处理函数
{
if(data){
alert("上传成功!");
$("#file1").val("");
}
flag = false;
},
error : function(data,status,e)//服务器响应失败处理函数
{
alert(e);
}
}
)
return false;
}
</script>
</body>
</html>
服务器端代码如下:
/**
*使用springmvc进行文件上传处理
*/
@RequestMapping("upload")
@ResponseBody
public boolean upload(HttpServletRequest request, HttpServletResponse response ) throws UnsupportedEncodingException
{
String path = request.getSession().getServletContext().getRealPath("");
Calendar calendar = Calendar.getInstance();
calendar.setTime(new Date());
request.setCharacterEncoding("UTF-8");
path = String.format("%s\\%s\\%s\\%s\\%s\\%s", path, "file", "upload", calendar.get(calendar.YEAR),
calendar.get(calendar.MONTH), calendar.get(calendar.DAY_OF_MONTH));
File filepath = new File(path);
if (!filepath.exists()) {
filepath.mkdirs();
} MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
// 获得文件
MultipartFile multipartFile = multipartRequest.getFile("file");
String filename = multipartFile.getOriginalFilename();
OutputStream os = null;
InputStream is = null;
File uploadFile = null;
try {
is = multipartFile.getInputStream();
if (is != null) {
uploadFile = new File(filepath, System.currentTimeMillis() + ".xls");
os = new FileOutputStream(uploadFile);
IOUtils.copy(is, os);
os.flush();
}
} catch (IOException e) {
e.printStackTrace();
return false;
} finally {
IOUtils.closeQuietly(os);
IOUtils.closeQuietly(is);
}
return true;
}
ajaxFileUpload文件上传的更多相关文章
- MVC+AjaxFileUpload文件上传
来源:微信公众号CodeL 本次给大家分享的是ajaxfileupload文件上传插件,百度一大堆功能超炫的文件上传插件,为什么我们会选择这个插件呢? 原因是在此之前,我们尝试使用过很多基于flash ...
- jQuery插件AjaxFileUpload文件上传实现Javascript多文件上传功能
Ajax file upload plugin是一个功能强大的文件上传jQuery插件,可自定义链接.或其它元素庖代传统的file表单上传结果,可实现Ajax动态提示文件上传 过程,同时支撑多文 ...
- spring mvc ajaxfileupload文件上传返回json下载问题
问题:使用spring mvc ajaxfileupload 文件上传在ie8下会提示json下载问题 解决方案如下: 服务器代码: @RequestMapping(value = "/ad ...
- AjaxFileUpload文件上传组件(php+jQuery+ajax)
jQuery插件AjaxFileUpload可以实现ajax文件上传,下载地址:http://www.phpletter.com/contents/ajaxfileupload/ajaxfileupl ...
- ajaxFileUpload 文件上传
源码: jQuery .extend({ createUploadIframe : function(id, uri) {//id为当前系统时间字符串,uri是外部传入的json对象的一个参数 //c ...
- JQuery文件上传插件ajaxFileUpload在Asp.net MVC中的使用
0 ajaxFileUpload简介 ajaxFileUpload插件是一个非常简单的基于Jquery的异步上传文件的插件,使用过程中发现很多与这个同名的,基于原始版本基础之上修改过的插件,文件版本比 ...
- ajaxFileupload多文件上传
最近有个功能模块需要上传图片,为了和之前的伙伴们保持一致我也使用了ajaxFileupload, 但是源码只支持单文件上传,所以百般斟酌之下决定修改源码,废话不多说直接上代码 HTML上传代码段: & ...
- 使用ajaxfileupload.js实现文件上传
ajaxFileUpload是一个异步上传文件的jQuery插件 语法:$.ajaxFileUpload([options]) options参数说明: 1.url 上传处理程序地址. 2,file ...
- 使用ajaxfileupload.js上传文件
一直以来上传文件都是使用form表单上传文件,也看到过有人使用js上传文件,不过看起来蛮简单的也就没有怎么去理会.今天突然要使用这种方式上传文件,期间还遇到点问题.因此就记录下来,方便以后遇到这样的问 ...
随机推荐
- mysql DDL时出现的锁等待状态
如下表格所示: session1: session2: 10:30:27 root@localhost:[testdb] mysql.sock>select * from t2;+------+ ...
- [C#高级编程]基础知识摘要一
核心C#: 值类型存储在堆栈中,而引用类型存储在托管堆上. object类型可以用于两个目的: 可以使用object引用绑定任何子类型的对象 object类型执行许多一般用途的基本方法,包括Equal ...
- 二元查找树转变成排序的双向链表之C#算法实现
此题为July在CSDN发布的微软编程面试100题中的第一题,觉得蛮有趣的,今天也拿过来玩玩,July的代码用的是C++实现,可能因为有指针的原因吧,感觉看起来相对比较容易理解整个的实现过程,而我,试 ...
- rightTeam SCRUM第一个冲刺周期
- C#反射的应用
项目框架中有一个很实用的方法,它用来获取客户端post的数据,并自动赋值到对象各属性,这样后台少写了很多代码.但是对于有主表.子表的表单,框架中没有提供自动给子表对象各属性赋值的方法,每次都要写很多代 ...
- JavaScript语言知识收藏
接触Web开发也已经有一段时间了,对javascript的认识也比以前有了更加深入的认识了,所以觉得应该整理一下. 一.JavaScript不支持函数(方法)的重载,用一个例子证明如下: functi ...
- ActiveReports 报表应用教程 (7)---交叉报表及数据透视图实现方案
在 ActiveReports 中可以通过矩阵控件非常方便的实现交叉报表,同时还可以设置数据的分组.排序.过滤.小计.合计等操作,可以满足您报表的智能数据分析等需求.在矩阵控件中组的行数和列数由每个行 ...
- Titanium开发环境搭建第三个坑
Nodejs版本的问题 首先,如下引用:http://docs.appcelerator.com/titanium/latest/#!/guide/Installing_Node To run all ...
- 关联规则-R语言实现
关联规则code{white-space: pre;} pre:not([class]) { background-color: white; }if (window.hljs && ...
- ahjesus ubuntu10.4安装ruby2.1.1
sudo apt-get install python-software-properties sudo apt-add-repository ppa:brightbox/ruby-ng sudo a ...