需求:
通过ajax异步方式上传图片,上传成功后做些操作
实现:
js部分:
引入:
<script src="http://js.linkrmb.com/ajax/jquery.upload.js" type="text/javascript"> </script>
代码:
function doUpload() { // 上传方法 $.upload({ // 上传地址 url: '${basePath}upload/img', // 文件域名字 fileName: 'filedata', // 上传完成后, 返回json, text dataType: 'json', // 上传之前回调,return true表示可继续上传 onSend: function() { return true; }, // 上传之后回调 onComplate: function(data) { $("#imgurl").val(data.msg.url); $("#imgname").val(data.msg.id); } }); }
html部分:
<tr> <td width="10%" > 封面图片: </td> <td width="90%"> <input id="imgname" name="imgname" type="text" readonly="readonly" > <input type="button" onclick="doUpload()" value="点击上传图片"> <input id="imgurl" name="imgurl" type="hidden" > </td> </tr>
java部分:
@RequestMapping(value = "/img", method = RequestMethod.POST) @ResponseBody public UploadResVo img(HttpServletRequest request) throws Exception { UploadResVo resVo = new UploadResVo(); MsgVo msg = new MsgVo(); String file = processImg(request, "imageDir"); msg.setId(file); msg.setLocalname(file); msg.setUrl(url); resVo.setMsg(msg); return resVo; } private String processImg(HttpServletRequest request,String imageDir) throws Exception { String uuid = CommonUtils.getUUID(); request.setCharacterEncoding("UTF-8"); DiskFileItemFactory factory = new DiskFileItemFactory(); ServletFileUpload upload = new ServletFileUpload(factory); List<FileItem> items = upload.parseRequest(request); Iterator<FileItem> itr = items.iterator(); while (itr.hasNext()) { FileItem item = (FileItem) itr.next(); if (item.isFormField()) { System.out.println("表单参数名:" + item.getFieldName() + ",表单参数值:" + item.getString("UTF-8")); } else { System.out.println("上传文件的大小:" + item.getSize()); System.out.println("上传文件的类型:" + item.getContentType()); System.out.println("上传文件的名称:" + item.getName()); String file = imageDir + File.separator +uuid+"."+ FilenameUtils.getExtension(item.getName()); item.write(new File(file)); return uuid+"."+ FilenameUtils.getExtension(item.getName()); } } return uuid; }
相关推荐
js ajax文件上传
Ajax 文件上传组件 Ajax 文件上传组件 Ajax 文件上传组件 Ajax 文件上传组件
上传文件AJAX上传文件AJAX上传文件AJAX上传文件AJAX上传文件AJAX上传文件AJAX
Struts jquery AJAX 文件上传
改装的ajax图片上传功能,实现图片上传无刷新
1.可用于移动端H5 2.可用于小程序webview,用于替代wx.uploadFile的技术方案 3.PHP服务端文件接收请使用$_FILES...5.如果后端接收到的tmp_name为空,请检查服务端允许上传的文件大小,比如PHP.ini的upload_max_filesize
ajax文件上传带进度条,带判断上传文件是否合法,ajax实现上传文件带进度条。
ajax文件上传,大家可以看一下。这个我没有做测试。是一个同事写的。不过他是一个很牛的开发者的哦····也是很不错的PM。
jquery+ajax文件上传 已做修改可传入其他表单参数
比如带进度条的文件上传,看了网上很多资料还没找到真正意义上的ASP.NET实现进度条上传.Ajax 文件上传进度条,ASP.NET 文件上传进度条示例,ASP.NET 文件上传,asp.net文件上传,ajax文件上传.源码示例
Ajax文件上传控件源代码 非ifrom 可以用在 updatepanel内
php+ajax文件上传,通过jquery ajax,获取页面文件数据,传输给php文件,由php存储前端传过来的文件到指定文件夹。
ajax异步文件上传,servlet处理
pmjFileUpload.js类封装了dhtmlXVaultObject非专业版v.1.5 build 9755。在dhtmlXVaultObject的基础上对代码进行了注释、汉化,并新增和修改了部分功能。具体的API文档还没时间整理出来,...设置文件格式限制需大写。
ajax文件上传,支持拖拽上传。修改了补丁,支持后台上传成功的回调。 演示页面在dist文件夹下 index.html
jquery实现的ajax文件上传功能 $.ajaxFileUpload ( { url:'doajaxfileupload.php', secureuri:false, fileElementId:'fileToUpload', dataType: 'json', success: function (data, ...