使用jquery.upload.js实现异步上传示例代码


Posted in Javascript onJuly 29, 2014

相关资源下载:upload

1:jsp代码:

导入jquery.upload.js和jquery-1.7.2.js

添加调用js的代码:<a href="javascript:void(0)" rel="external nofollow" onclick="doUpload()">上传</a>

在底部写:

<iframe style="position:absolute;top:-9999px" src="<%=basePath%>/resources/upload/upload.htm"/></iframe>

2:js代码:

/*文件上传*/
function doUpload() {
// 上传方法
$.upload({
// 上传地址
url:window.basePath+'/reply/imageUpload', 
// 文件域名字
fileName: 'uploadfile', 
// 其他表单数据
params: {},
// 上传完成后, 返回json, text
dataType: 'json',
// 上传之前回调,return true表示可继续上传
onSend: function() {
return true;
},
onSubmit: function(){
},
// 上传之后回调
onComplate: function(data) {
if(data.msg){

}else{
alert("上传图片出错!");
}
}
});
}

3:后台代码:

/**
* 图片上传本地服务器
* @param request
* @param response
* @return
*/
@RequestMapping(value="imageUpload")
@ResponseBody
public Object imageUpload(HttpServletRequest request,HttpServletResponse response){
Map<String, Object> map=new HashMap<String, Object>();
UploadUtil uploadUtil = new UploadUtil();
try {
String url = uploadUtil.excelUpload(request, response);// 文件上传
} catch (IOException e) {
e.printStackTrace();
}
return map;
}
Javascript 相关文章推荐
jquery插件之easing使用
Aug 19 Javascript
EasyUI中的tree用法介绍
Nov 01 Javascript
原生Js实现元素渐隐/渐现(原理为修改元素的css透明度)
Jun 24 Javascript
JS简单的图片放大缩小的两种方法
Nov 11 Javascript
jQuery时间轴插件使用详解
Jul 16 Javascript
Node.js巧妙实现Web应用代码热更新
Oct 22 Javascript
js检查是否关闭浏览器的方法
Aug 02 Javascript
JavaScript中apply方法的应用技巧小结
Sep 29 Javascript
Swiper自定义分页器使用详解
Dec 28 Javascript
使用vue-router与v-if实现tab切换遇到的问题及解决方法
Sep 07 Javascript
在React中写一个Animation组件为组件进入和离开加上动画/过度效果
Jun 24 Javascript
JavaScript实现手风琴效果
Feb 18 Javascript
js动态添加onclick事件可传参数与不传参数
Jul 29 #Javascript
使用focus方法让光标默认停留在INPUT框
Jul 29 #Javascript
Node.js 服务器端应用开发框架 -- Hapi.js
Jul 29 #Javascript
node.js 开发指南 ? Node.js 连接 MySQL 并进行数据库操作
Jul 29 #Javascript
js返回前一页刷新本页重载页面
Jul 29 #Javascript
extjs 如何给column 加上提示
Jul 29 #Javascript
extjs 分页使用jsp传递数据示例
Jul 29 #Javascript
You might like
PHPAnalysis中文分词类详解
2014/06/13 PHP
php include类文件超时问题处理
2015/02/06 PHP
PHP常用处理静态操作类
2015/04/03 PHP
YII中Ueditor富文本编辑器文件和图片上传的配置图文教程
2017/03/15 PHP
ThinkPHP实现生成和校验验证码功能
2017/04/28 PHP
js open() 与showModalDialog()方法使用介绍
2013/09/10 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
jQuery中last()方法用法实例
2015/01/06 Javascript
简介可以自动完成UI的AngularJS工具angular-smarty
2015/06/23 Javascript
JavaScript声明变量名的语法规则
2015/07/10 Javascript
JQuery点击事件回到页面顶部效果的实现代码
2016/05/24 Javascript
JS Array创建及concat()split()slice()的使用方法
2016/06/03 Javascript
NodeJS实现客户端js加密
2017/01/09 NodeJs
Vue获取DOM元素样式和样式更改示例
2017/03/07 Javascript
微信小程序模版渲染详解
2018/01/26 Javascript
Angular2中监听数据更新的方法
2018/08/31 Javascript
[48:05]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 VGJ.T vs VP
2018/03/31 DOTA
[47:22]Mineski vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
bat和python批量重命名文件的实现代码
2016/05/19 Python
Python 基础教程之str和repr的详解
2017/08/20 Python
解决Scrapy安装错误:Microsoft Visual C++ 14.0 is required...
2017/10/01 Python
python实现神经网络感知器算法
2017/12/20 Python
python在每个字符后添加空格的实例
2018/05/07 Python
使用Python实现在Windows下安装Django
2018/10/17 Python
Python3数字求和的实例
2019/02/19 Python
Python 实现数据结构-循环队列的操作方法
2019/07/17 Python
Python3.0 实现决策树算法的流程
2019/08/08 Python
发现世界上最好的珠宝设计师:JewelStreet
2017/12/17 全球购物
德国滑雪和户外用品网上商店:XSPO
2019/10/30 全球购物
大学毕业感言一句话
2014/02/06 职场文书
先进事迹报告会主持词
2014/04/02 职场文书
反邪教宣传工作方案
2014/05/07 职场文书
优秀实习生主要事迹
2014/05/29 职场文书
社区党的群众路线教育实践活动总结材料
2014/10/31 职场文书
用几道面试题来看JavaScript执行机制
2021/04/30 Javascript
解决Mysql多行子查询的使用及空值问题
2022/01/22 MySQL