关闭

Kind Editor 编辑器 图片上传

标签: 编辑器spring mvcmybatis
368人阅读 评论(0) 收藏 举报

KindEditor 编辑器 图片上传

最近接触到了html文本的存储。 以前没有涉及这么全面的html + 图片 上传。

今天用KindEditor 做了一些功能。 我的项目用spring mvc+mybatis 整的。


贴出我的前端和后端代码 。供新手参考。 不用多余jar。 跟普通上传图片差不多。


前端js代码

  1. var editor;  
  2.         KindEditor.ready(function(K) {  
  3.             var editor = K.create('textarea[name="Description"]', {  
  4.                 uploadJson : 'kingedit/imageUpload',上传图片的地址  
  5.             });  
  6.               
  7.               
  8.         });  

前端html代码

  1. <textarea rows="5" cols="70" name="Description"></textarea>  
  2.                   


后端上传图片代码,注意,编辑器必须接收到返回的json。

  1. @RequestMapping("/imageUpload")  
  2.     @ResponseBody  
  3.     public String imageUpload(MultipartHttpServletRequest request) throws Exception {  
  4.         String webpath =  null;  
  5.         try {  
  6.             //上传图片  
  7.             MultipartFile file = request.getFile("imgFile");  
  8.             webpath = FileUtil.saveWebImgFile(file);  
  9.             if(StringUtils.isNotEmpty(webpath)){  
  10.                 String path = request.getContextPath();  
  11.                 String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
  12.                 webpath = "{\"error\" : 0,\"url\" : \""+basePath+webpath+"\"}";//成功  
  13.             }else{  
  14.                 webpath = "{\"error\" : 0,\"message\" : \"上传文件不存在\"}";//失败  
  15.             }  
  16.         }catch (Exception e) {  
  17.             e.printStackTrace();  
  18.         }  
  19.         return webpath;  
  20.     }  
0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:100167次
    • 积分:2985
    • 等级:
    • 排名:第11792名
    • 原创:208篇
    • 转载:14篇
    • 译文:0篇
    • 评论:5条
    最新评论