利用ajaxfileupload.js异步上传文件
1、引入ajaxfileupload.js
2、html代码
<input type="file" id="enclosure" name="enclosure">
<button id="upClick" >上传</button>
注意这里的input控件的id和name必须一致;这样在后台利用springMVC接受文件的时候能对应起来;
3、JS代码
<script type="text/javascript">
$(document).ready(function(){
$("#upClick").click(function(){
$.ajaxFileUpload(
{
url:'MyMail/addEnclosure',
secureuri:false,
fileElementId:'enclosure', //文件选择框的id和name要一样的名字
dataType: 'json',
success: function (data, status){
//这里的返回值利用JSON
$('#filePath').val(data['filePath']);
$('#result').html(data['message']);
},error: function (data, status, e){
$('#result').html(data['message']);
}
}
);
});
});
</script>
4、springMVC的controller
/***
* 上传附件
* @return
*/
@RequestMapping("/addEnclosure")
public @ResponseBody String uploadFile(@RequestParam("enclosure") CommonsMultipartFile file){ JSONObject object = new JSONObject();
object.put("filePath", file.getOriginalFilename());10 String returnJson = "";
try {
//使用ajaxfileupload.js异步上传文件,返回值乱码,重新编码处理
returnJson = new String(JSONObject.fromObject(object).toString().getBytes("utf-8"),"iso-8859-1");
} catch (UnsupportedEncodingException e) {
e.printStackTrace();
}
return returnJson;
}
利用ajaxfileupload.js异步上传文件的更多相关文章
- 利用ajaxfileupload插件异步上传文件
html代码: <input type="file" id="imgFile" name="imgFile" /> js代码: ...
- ajaxfileupload.js异步上传
转载:https://www.cnblogs.com/labimeilexin/p/6742647.html jQuery插件之ajaxFileUpload ajaxFileUpload.js ...
- Node.js——异步上传文件
前台代码 submit() { var file = this.$refs.fileUpload.files[0]; var formData = new FormData(); formData.a ...
- JS异步上传文件
直接调用Upload(option)方法,即可上传文件,不需要额外的插件辅助,采用原生js编写. /* *异步上传文件 *option参数 **url:上传路径 **data:上传的其他数据{id:& ...
- 关于js异步上传文件
好久没登录博客园了,今天来一发分享. 最近项目里有个需求,上传文件(好吧,这种需求很常见,这也不是第一次遇到了).当时第一想法就是直接用form表单提交(原谅我以前就是这么干的),不过表单里不仅有文件 ...
- 关于JQuery.form.js异步上传文件点滴
好久没动代码了,前几天朋友委托我帮忙给做几个页面,其中有个注册带图片上传的页面.已之前的经验应该很快就能搞定,没想到的是搞了前后近一天时间.下面就说说异步上传的重要几个点,希望自己下次遇到此类问题的时 ...
- vue.js异步上传文件前后端代码
上传文件前端代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type&q ...
- ajaxfileupload.js ajax上传文件(含application/json)
jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId = 'jUploadFrame' ...
- 使用ajaxfileupload.js实现上传文件功能
<div class="pictureList"> <div class="pictureItem" id="uploadItem& ...
随机推荐
- Book LIst
Go ahead. Linux APUE Linux Kernel Development 鸟哥的linux私房菜 基础篇 鸟哥的linux私房菜 服务器篇 Network Computer Netw ...
- POJ3083Catch That Cow[BFS]
Catch That Cow Time Limit: 2000MS Memory Limit: 65536K Total Submissions: 77420 Accepted: 24457 ...
- AC日记——Dividing poj 1014
Dividing Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 69575 Accepted: 18138 Descri ...
- AC日记——逆波兰表达式 openjudge 3.3 1696
1696:逆波兰表达式 总时间限制: 1000ms 内存限制: 65536kB 描述 逆波兰表达式是一种把运算符前置的算术表达式,例如普通的表达式2 + 3的逆波兰表示法为+ 2 3.逆波兰表达式 ...
- u3d_shader_surface_shader_3
参考http://my.oschina.net/u/138823/blog/181131 加了个凹凸贴图: 抱歉把女神苏菲做成这样. 一:Normal Texture的制作: 1.首先是Normal ...
- bzoj1036 [ZJOI2008]树的统计Count
1036: [ZJOI2008]树的统计Count Time Limit: 10 Sec Memory Limit: 162 MB Submit: 12646 Solved: 5085 [Subm ...
- oracle中substr() instr() 用法
--substr(字符串,截取开始位置,截取长度)=返回截取的字 ,) from dual;--返回结果为:m ,) from dual;--返回结果为:m--说明0和1都表示截取的位置为第一个字符 ...
- WKWebView捕获HTML弹出的Alert和Confirm
之前用WebView装载一个网页时,弹出Alert时会显示网址,由于不想把网址暴露给用户这样显示就不是很友好了.UIWebView文档内没有找到可以捕获这类信息的API.GOOGLE了下发现了WKWe ...
- 【转】mysql触发器的实战(触发器执行失败,sql会回滚吗)
1 引言Mysql的触发器和存储过程一样,都是嵌入到mysql的一段程序.触发器是mysql5新增的功能,目前线上凤巢系统.北斗系统以及哥伦布系统使用的数据库均是mysql5.0.45版本,很多程 ...
- Post model至Web Api
Post model可以解决多动态性的参数至Web Api中去,获取数据或是创建数据.如果一个对象有很多字段,需要对每一个字段进行查询或是在创建对象时,我们可以考虑使用model来作参数.这样不必在控 ...