KindEditor4 struts2 jsp 本地图片或文件上传

近期做了一个图片和文件上传的东西，记录一下

1.先说说上传图片的

jsp代码

下面的设置主要的有三处

allowImageUpload : true,
uploadJson: 'activity_saveActdescImg.html',
还有items中要加入image。

KindEditor.ready(function(K) {
   editoractdesc = K.create('textarea[id="textactdesc"]', {
    //2或1或0，2时可以拖动改变宽度和高度，1时只能改变高度，0时不能拖动
    resizeType : 0,
    //换行符
    newlineTag : 'br',
    //能否上传本地图片
    allowImageUpload : true,
    //上传图片的action   
    uploadJson: 'activity_saveActdescImg.html',
    items : [
     'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
     'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', '|', 'emoticons', 'link', 'image',
     'insertfile' ]
   });

  });

 

<textarea id="textactdesc"  style="width:100%;height:550px;hvisibility:hidden;" >${activityInfo.actdesc}</textarea>

 

 

java的action代码

定义以下变量，以便能够获得图片文件到action。

private File imgFile;  
 private String imgFileFileName;  
 private String imgWidth;
 private String imgHeight;
 private String align;
 private String imgTitle;

 

剩下的就是写一个action上传文件了，那就是struts2的了。

这里有一个返回到页面显示的问题，就是上传了，怎么显示到编辑框中呢

我开始也有这个问题。下面是action中上传完文件后的代码

下面url就是你需要图片显示的路径，只要能在图片控件中显示，这里就能自动的加载到kindeditor中显示了。

PrintWriter out = null;                  
   out = response.getWriter();       

   JSONObject obj = new JSONObject();
   obj.put("error", 0);
   obj.put("url", Constants.PICTURE_ADDRESS_PREFIX + fileUrl);
   out.println(obj.toString());

 

在action最后返回的时候

return null;就可以了

 

2.下面说说上传文件的。

其实很简单，在items中加入'insertfile'就可以了。

我用的上传action和图片的是用的一个action。

 

当然你也可以不用上面图片上传的action，具体的可以看看image.js,insertfile.js这两个文件

一个是上传图片的一个是上传文件的。

你可以改其中的文件名和上传用的action，这里边都是用的php。