jquery实现文件异步上传
前言
这里用了2个JS插件,一个是Jquery原生js,我的版本是jquery-1.7.2.min.js,另一个是jquery.form.js。这个form.js 是关键,不可少哦。另外,
我的服务器端用的是Play Framework,版本是2.1。下面是代码部分,贴出的是关键部分:
1.前端代码
html:
<form id="form1" method="POST" action="/image/upload" ENCTYPE="multipart/form-data">
<input id="uploadFile" type="file" name="myfile" />
</from>
Javascript:
$("#uploadFile").change(function(){
var message = "t";
$("#form1").ajaxSubmit({
method : "POST",
success : function(data){
//成功
if(data == "ok"){
alert("上传成功")
}else{
alert("上传失败");
}
},
error : function(){
alert("网络错误,请稍后重新尝试!");
}
});
});
2.服务端代码
public static void upload(File myfile){
String msg = "fail";
try{
//图片写入路径,此处我的位置是项目的根目录
File temp = new File(myfile.getName());
//输入文件流
FileInputStream input = new FileInputStream(myfile);
//输出文件流
FileOutputStream out = new FileOutputStream(temp); //每次写入的字节的大小
byte [] b = new byte[1024];
//文件长度
int n; while((n=input.read(b)) != -1){
//写入字节
out.write(b, 0, n);
} input.close();
out.flush();
out.close();
msg = "ok";
}catch(Exception e){
Logger.error("Image.upload()", e.getMessage());
}
renderJSON(msg);
}
jquery实现文件异步上传的更多相关文章
- Jquery FormData文件异步上传 快速指南
网站中文件的异步上传是个比较麻烦的问题,不过现在通过jquery 可以很容易的解决这个问题: 使用jquery2.1版本,较老版本不支持异步文件上传功能: 表单代码: <form id=&quo ...
- struts1 & jquery form 文件异步上传
1.概述 还在用struts1?是的,在地球的没写地方,落后的生产方式还在运转(老项目). 从 继承org.apache.struts.action.Action, 继承org.apache.stru ...
- 【转】JQuery插件ajaxFileUpload 异步上传文件(PHP版)
前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错,但是由于手机不支持flash,所以不得不再找一个文件上传插件来用了.后来发现a ...
- JQuery插件ajaxFileUpload 异步上传文件(PHP版)
太久没写博客了,真的是太忙了.善于总结,进步才会更快啊.不多说,直接进入主题. 前几天想在手机端做个异步上传图片的功能,平时用的比较多的JQuery图片上传插件是Uploadify这个插件,效果很不错 ...
- 文件的上传(表单上传和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异步上传并客户端验证类型和大小 ...
- SpringMVC + AJAX 实现多文件异步上传
转自:https://www.jianshu.com/p/f3987f0f471f 今天,我就这个问题来写一篇如何用 SpringMVC + AJAX 实现的多文件异步上传功能.基本的代码还是沿用上篇 ...
- 文件的上传(1)(表单上传和ajax文件异步上传)
文件的上传(表单上传和ajax文件异步上传) 项目中用户上传总是少不了的,下面就主要的列举一下表单上传和ajax上传!注意: context.Request.Files不适合对大文件进行操作,下面列举 ...
随机推荐
- 【转载】小米2进入recovery的方法
用过M1的朋友都多多少少的了解到~进入recovery是关机下同时 按 音量(+)+电源键. 其实M2也一样,但是我觉得是有点区别的. 在M1的时候,只要同时长按这两个键就可以的了. 但是M2呢?我发 ...
- olacle数据库员工表的创建,及插入数据,添加约束,删除列,查询数据的sql语句
---删除原有的员工表drop TABLE employee;---创建员工表CREATE TABLE employee ( empno NUMBER(4) NOT NULL, ...
- 在SQL2008R2查询分析器出错(在执行批处理时出现错误。错误消息为: 目录名称无效。)
在用SQL2008R2查询分析器时 SELECT * FROM 表名; 出错: 在执行批处理时出现错误.错误消息为: 目录名称无效. 原因: 在打开查询分析器时,用360软件清空了临时文件(只是偶尔1 ...
- BIG biang教你误删oracle 怎么办,
今天无意中在网上看到了关于oracle误删除数据恢复的一条信息,发现的确很好使,下面就我的测试向大家汇报下. 1. select * from t_viradsl2 t //查询t_v ...
- MyEclipse中SVN的常见的使用方法
本次主要内容: 一 .导入项目 (Checkout).从svn资源库检出 二 .更新 (Update) 三.锁(对要修改的文件加锁,防止文件冲突) 四.提交(项目修改后的提交) 五.解锁 六.查看历史 ...
- SSH 端口映射(一)
转载:http://blog.csdn.net/a351945755/article/details/21785647,http://blog.csdn.net/gaoming655/article/ ...
- hdu 3064 twoNumber
twoNumber Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 2048/1024 K (Java/Others) Total Su ...
- git一些常用设置
用法:git config [选项] 配置文件位置 --global 使用全局配置文件 --system 使用系统级配置文件 -- ...
- java Annotation Demo
Java 1.5引入了annotation,这个功能非常好用,是用c#等语言借鉴过来的一个特性. 首先编译器本身支持一些像overrides,supresswarning之类的注解. Spring,j ...
- 探索 OpenStack 之(9):深入块存储服务Cinder (功能篇)
继研究了Neutron之后,继续Nova的外围研究之旅.本站是研究块存储服务Cinder. 0.验证环境 环境包括: 1.一个controller节点,运行nova-api, nova-schedul ...