上传图片
2015-11-26 11:37
661 查看
1.jsp页面代码
2.JavaScript代码
3.java代码
<pre name="code" class="html"><div class="rank must"> <span class="label">品牌图标:</span> <form action="#" id="apply" name="apply" method="post"> <input type="file" class="file" name="imgLogo" value="" id="imgLogo" style="display: none;" accept="image/*" /> <input type="hidden" name="brandLogo" id="brandLogo" value="" /> </form> <button type="button" class="btn btn-primary" onclick="document.getElementById('imgLogo').click();" style="width: 100px;float: left;">上传图片</button> </div> <div class="rank"> <span class="label"> </span> <img id="imgsrc" src="" style="max-width: 350px;" /> </div>
2.JavaScript代码
<script type="text/javascript"> $(document).ready(function() { $("input[name='imgLogo']").change(function() { var imgCopy = $("#imgsrc").attr("src"); $("#imgsrc").attr("src","${cp}/img/load.gif"); var options = { url : "${cp}/brand/ajaxGetLogo", //跳转到相应的Action type : "POST", // 提交方式 dataType : "json", // 数据类型 success : function(data,textStatus) { if (data.optFlag == 'Y') { $("#imgsrc").attr("src",data.imgUrl); $("#brandLogo").val(data.imgUrl); }else{ showMsg("上传图片出错!"); $("#imgsrc").attr("src",imgCopy); } }, error : function(XMLHttpRequest,textStatus,errorThrown) { showMsg("上传图片出错!"); $("#imgId").attr("src",imgCopy); } }; $("#apply").ajaxSubmit(options); // 绑定页面中form表单的id return false; }); //提交事件 $("#add_btn").click(function(){ var brandName = $("input[name='brandName']").val().trim(); var brandIsshow = $(":radio[name='brandIsshow']:checked").val(); var brandLogo = $("#brandLogo").val().trim(); if(!brandName) { showMsg("品牌名称不能为空!"); return false; } if(!brandLogo) { showMsg("品牌图片必须上传!"); return false; } $.post("${cp}/brand/addBrand", { "brandName" : brandName, "brandIsshow" : brandIsshow, "brandLogo" : brandLogo }, function(data) { if (data.flag) { alert("信息编辑成功"); history.go(-1); } else { $("input[name='brandName']").focus(); showMsg(data.msg); } },"json"); }); $("#brandName").blur(function(){ $.post("${cp}/brand/checkName", { "brandName" : $(this).val() }, function(data) { if (data.flag) { showMsg(data.msg); $(this).focus();//获得焦点 } },"json"); }); }); var timeout; function showMsg(msg) { $("#msg").html(msg); $("#msg").show(); if (timeout != undefined) clearTimeout(timeout); timeout = setTimeout(function hiddenMsg() { $("#msg").html(""); $("#msg").hide(); }, 5000); } </script>
3.java代码
/** * 上传品牌图片 * @param request * @return */ @RequestMapping(value = "/ajaxGetLogo") @ResponseBody public Map<String, Object> uploadLogo(HttpServletRequest request) { Map<String, Object> map = new HashMap<String, Object>(); try { MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request; /** 构建图片保存的目录 **/ String path = "/brand/"; String realpath = request.getSession().getServletContext() .getRealPath(path); /** 页面控件的文件流 **/ MultipartFile multipartFile = multipartRequest.getFile("imgLogo"); String imgLogoFileName = multipartFile.getOriginalFilename(); String fileType = ImageZipUtil.getFileType(imgLogoFileName); String imageName = "brand_" + System.currentTimeMillis() + "." + fileType; File savefile = new File(new File(realpath), imageName); if (!savefile.getParentFile().exists()) savefile.getParentFile().mkdirs(); multipartFile.transferTo(savefile); String imgUrl = "http://localhost/项目名" + path + imageName; map.put("optFlag", "Y"); map.put("imgUrl", imgUrl); } catch (Exception e) { map.put("optFlag", "E"); map.put("optDesc", "系统错误,请稍后重试!"); } return map; } } /** * 上传图片 * @param request * @return */ @RequestMapping(value = "/ajaxGetLogo") @ResponseBody public Map<String, Object> uploadLogo(HttpServletRequest request) { Map<String, Object> map = new HashMap<String, Object>(); try { MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request; /** 构建图片保存的目录 **/ String path = "/item/category/images/"; String realpath = request.getSession().getServletContext() .getRealPath(path); /** 页面控件的文件流 **/ MultipartFile multipartFile = multipartRequest.getFile("imgLogo"); String imgLogoFileName = multipartFile.getOriginalFilename(); String fileType = ImageZipUtil.getFileType(imgLogoFileName); String imageName = "category_" + System.currentTimeMillis() + "." + fileType; File savefile = new File(new File(realpath), imageName); if (!savefile.getParentFile().exists()) savefile.getParentFile().mkdirs(); multipartFile.transferTo(savefile); ImageZipUtil.resizeImage(savefile.getPath(),savefile.getPath(),300,300); Thread.sleep(1000); String imgUrl = path + imageName; map.put("optFlag", "Y"); map.put("imgUrl", imgUrl); } catch (Exception e) { map.put("optFlag", "E"); map.put("optDesc", "系统错误,请稍后重试!"); } return map; }
相关文章推荐
- Linux 下JDK1.7.0_75的安装
- 这个错误,每个ScrumMaster都犯过
- Express难点解析
- csv操作帮助类
- java代码检查工具-FindBugs
- 如果要创业,你应该如何选择创业方向?
- Memcached安装配置
- svn服务搭建
- 自定义UINavigationController 切换动画
- Bootstrap每天必学之按钮
- Learning ROS for Robotics Programming Second Edition学习笔记(六) indigo xtion pro live
- Learning ROS for Robotics Programming Second Edition学习笔记(六) indigo xtion pro live
- Learning ROS for Robotics Programming Second Edition学习笔记(六) indigo xtion pro live
- app评论
- UltraEdit相关设置
- HTML与JSP页面的区别
- pymol png python 不输出图片 ray解决方法 ,
- opengl绘制出现锯齿的一个可能原因
- C#导出数据到Excel通用的方法类
- ehcache页面缓存